Soumettre un lien - Pas de Javascript: Downsides?

Question

Je suis venu l'autre jour sur une révélation. Lors d'une tentative de créer un bouton soumettre, en utilisant une image, je suis tombé sur un problème où l'image n'a pas été affiché, mais le texte était value. A l'époque, ce n'est pas ce que je voulais, mais maintenant, comme je regarde en arrière, je vois une utilisation potentielle pour cela.

Si vous avez besoin d'envoyer des données vers une autre page, mais aucun d'entre elle nécessite l'entrée d'utilisateur, vous pouvez l'envoyer dans le lien (ou forme) par l'intermédiaire GET ou par un formulaire via POST. Le problème est que l'ancien crée des URL laids et cette dernière nécessite un bouton submit qui semble hors de propos. Bien sûr, je pourrais venir avec une image, mais si je voulais juste le texte sélectionné.

Alors, je commencé à jouer un peu et Firefox semble rendre ce qui suit que je veux, en tant que lien cliquable qui présente une forme. Tout ce que vous avez à faire est de supprimer l'attribut src de la balise input type='image':

<form action='some_page' method='post'>
  <input type='hidden' name='email_address' value='test@test.com' />
  <input type='image' value='E-mail User' />
</form>

Est-ce que ce travail de solution sur les autres navigateurs? Quels sont les inconvénients à le faire (à part le fait évident que votre lien CSS est appliqué correctement pas)?

Answer 1

J'aime une solution qui utilise un lien réel (caché) qui se trouve exposé via javascript conjointement avec un bouton dans une balise noscript.

 <form action="some_page" method="post">
    <input type="hidden" name="email_address" value="test@test.com" />
    <a href="#" class="submit-link" style="display: none;">E-mail User</a>
    <noscript>
       <input type="submit" value="E-mail User" />
    </noscript>
 </form>

 $('submit-link').click( function() {
     $(this).closest('form').submit();
     return false;
 })
 .show();

Answer 2

Il n'y a pas besoin d'utiliser une entrée d'image, pourquoi ne pas simplement utiliser un bouton régulièrement fournir et d'appliquer un peu de style à la main lourde faire ressembler à du texte normal?

<input type="submit" value="E-mail User" class="link">

<style>
input.link {
    border: none;
    background: none;
    cursor: pointer;
    /* etc */
}
</style>

Answer 3

En utilisant HTML 4.01 Strict il a travaillé sur FF3.5, mais pas sur IE8 ou Chrome. Le lien fonctionne, mais il n'y a pas de texte juste un endroit vide pour une image manquante.

Alors, cela semble être une mauvaise idée, car il ne peut travailler sur un navigateur. Pour moi, c'est un assez gros inconvénient, à moins que votre marché est seulement pour les navigateurs Firefox, puis, allez-y, une grande idée. :)

Comme suggéré James Skidmore, il est facile de faire une onclick avec le javascript pour soumettre un message.

Je suggère JS discret, donc, si quelqu'un n'a pas JS sur il fonctionnera comme un lien, faire une demande GET, mais si elles ont JS il serait alors changer le comportement à être POST sans url laid changement.

Or, comme on l'a mentionné le fond de l'image peut se fondre dans l'arrière-plan de la forme.

Answer 4

Vous pouvez en présenter le formulaire dynamiquement via JS, ou utiliser un bouton régulièrement présenter avec un fond transparent ou blanc.