web-dev-qa-db-fra.com

Comment faire une soumission à partir d'un lien <a href...> ... </a>?

J'ai une image avec des liens vers une autre page en utilisant <a href="..."> <img ...> </a>.

Comment puis-je lui faire un post comme s'il s'agissait d'un bouton <input type="submit"...>?

55
fmsf
<input type="image" name="your_image_name" src="your_image_url.png" />

Cela enverra le your_image_name.x et your_image_name.y valeurs lorsqu’il soumet le formulaire, c’est-à-dire les coordonnées x et y de la position sur laquelle l’utilisateur a cliqué sur l’image.

34
Jeremy Ruten

Approche plus générique utilisant JQuery bibliothèque le plus proche () et submit () boutons. Ici, vous ne devez pas spécifier quel formulaire vous souhaitez soumettre, soumettez le formulaire dans lequel il se trouve.

<a href="#" onclick="$(this).closest('form').submit()">Submit Link</a>
111

On dirait que vous essayez d'utiliser une image pour soumettre un formulaire ... dans ce cas, utilisez <input type="image" src="...">

Si vous voulez vraiment utiliser une ancre, vous devez utiliser javascript:

<a href="#" onclick="document.forms['myFormName'].submit(); return false;">...</a>

26
Greg

type d'entrée = image le fera pour vous.

9
Tim Howland

Non testé/pourrait être mieux:

<form action="page-you're-submitting-to.html" method="POST">
    <a href="#" onclick="document.forms[0].submit();return false;"><img src="whatever.jpg" /></a>
</form>
7
Shawn
 <html>

 <?php

 echo $_POST['c']." | ".$_POST['d']." | ".$_POST['e'];

 ?>

 <form action="test.php" method="POST">
      <input type="hidden" name="c" value="toto98">
      <input type="hidden" name="d" value="toto97">
      <input type="hidden" name="e" value="toto aaaaaaaaaaaaaaaaaaaa">

      <a href="" onclick="document.forms[0].submit();return false;">Click</a> 
 </form>

</html>


So easy.




So easy.
6
Jiky1

Ce qui pourrait être un ajout utile à cela est la possibilité de changer la post-url du bouton supplémentaire afin que vous puissiez poster des URL différentes avec des boutons différents. Ceci peut être réalisé en définissant la propriété 'action' du formulaire. Voici le code pour cela lors de l'utilisation de jQuery:

$('#[href button name]').click(function(e) {
    e.preventDefault();
    $('#[form name]').attr('action', 'alternateurl.php');
    $('#[form name]').submit();
});

L'attribut action a quelques problèmes avec les anciennes versions de jQuery, mais vous pourrez y aller le dernier.

2
Grit

N'oubliez pas l'élément "BUTTON" qui peut gérer un peu plus de HTML à l'intérieur ...

1
Pablo Cabrera

Quelque chose comme cette page ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>BSO Communication</title>

<style type="text/css">
.submit {
    border : 0;
    background : url(ok.gif) left top no-repeat;
    height : 24px;
    width : 24px;
    cursor : pointer;
    text-indent : -9999px;
}
html:first-child .submit {
    padding-left : 1000px;
}
</style>
<!--[if IE]>
<style type="text/css">
.submit {
    text-indent : 0;
    color : expression(this.value = '');
}
</style>
<![endif]-->
</head>

<body>
    <h1>Display input submit as image with CSS</h1>

    <p>Take a look at <a href="/2007/07/26/afficher-un-input-submit-comme-une-image/">the related article</a> (in french).</p>
    <form action="" method="get">
        <fieldset>
            <legend>Some form</legend>
            <p class="field">
                <label for="input">Some value</label>

                <input type="text" id="input" name="value" />
                <input type="submit" class="submit" />
            </p>
        </fieldset>
    </form>

    <hr />
    <p>This page is part of the <a href="http://www.bsohq.fr">BSO Communication blog</a>.</p>

</body>
</html>
1
VonC

Nous remplaçons le bouton d'envoi par ceci tout le temps sur les formulaires:

<form method="post" action="whatever.asp">
<input type=...n

<input type="image" name="Submit" src="/graphics/continue.gif" align="middle" border="0" alt="Continue">
</form>

En cliquant sur l'image, vous soumettez le formulaire. J'espère que ça t'as aidé!

0
Kateriana