web-dev-qa-db-fra.com

href autour du type d'entrée submit

pourquoi un href autour d'un type d'entrée ne fonctionne-t-il pas dans IE? (et que puis-je faire pour le réparer)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org    /TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen">
</head>
<body>
<a href="1.html"><input type="submit" class="button_active" value="1"></a>
<a href="2.html"><input type="submit" class="button" value="2"></a>
<a href="3.html"><input type="submit" class="button" value="3"></a>
</body>
</html>

style.css:

* {
    margin: 0;
    padding: 0;
}

/* CSS Buttons: http://www.web4site.de/css/css-buttons.php */
.button {
    padding:0;
    margin:0;
    border:none;
    font-size:14px;
    background: url(../img/button.gif) no-repeat center;
    color: #000000;
    height:27px;
    width:134px; 
    font-variant:small-caps;
}

.button:hover {
    padding:0;
    margin:0;
    border:none;
    font-size:14px;
    background: url(../img/button.gif) no-repeat center;
    color: #FF0000;
    height:27px;
    width:134px; 
    text-decoration:none;
    font-variant:small-caps;
}

.button_active {
    padding:0;
    margin:0;
    border:none;
    font-size:14px;
    background: url(../img/button.gif) no-repeat center;
    color: #FF0000;
    height:27px;
    width:134px; 
    font-variant:small-caps;
}

Cela fonctionne très bien dans firefox ...

htmlcssformsbutton
6
Marc

Pourquoi voudriez-vous mettre un bouton de soumission à l'intérieur d'une ancre? Vous essayez de soumettre un formulaire ou accédez à une page différente. Laquelle est-ce? 

Soit soumettre le formulaire: 

<input type="submit" class="button_active" value="1" />

Ou allez sur une autre page: 

<input type="button" class="button_active" onclick="location.href='1.html';" />
13
Kon

Cela ne fonctionne pas parce que cela n'a pas de sens (si peu de sens que HTML 5 l'interdit explicitement).

Pour résoudre ce problème, décidez si vous voulez un lien ou un bouton d'envoi et utilisez celui que vous voulez réellement (indice: vous n'avez pas de formulaire, un bouton d'envoi n'a donc aucun sens).

10
Quentin

Je suis d'accord avec Quentin. Cela n’a aucun sens de savoir pourquoi vous voulez le faire comme ça. Cela fait partie du concept Web sémantique . Vous devez planifier les objets de votre site Web pour une intégration/expansion future. Une autre application Web ou site Web ne peut pas interagir avec votre contenu s'il ne suit pas le cas d'utilisation approprié.

IE et Firefox sont deux bêtes différentes. Il y a beaucoup de choses que IE permet à Firefox et aux autres navigateurs normalisés de rejeter.

Si vous essayez de créer des boutons sans soumettre de données, utilisez une combinaison de DIV/CSS.

0
fergatron

Placez l'emplacement du lien dans le action="" d'une balise d'emballage form. 

Votre premier lien serait:

<form action="1.html">
    <input type="submit" class="button_active" value="1">
</form>
0
Phil
<a href="1.html"><input type="text" class="button_active" value="1"></a>
<a href="2.html"><input type="text" class="button" value="2"></a>
<a href="3.html"><input type="text" class="button" value="3"></a>

Essayez ça. À moins que vous n'ayez vraiment besoin de vous en tenir au type soumis, alors ce que j'ai fourni devrait fonctionner. Si vous vous en tenez à submit, alors tout ce qui est mentionné ci-dessus est correct, cela n'a aucun sens. 

0
ImagineCustoms