通过单击链接提交表单，而无需使用提交按钮

我试图通过单击链接提交表单，而无需使用提交按钮。表单中的每个元素都有其值，点击时必须提交。它不起作用。我可以使用JavaScript或jQuery。请大家在代码一看：通过单击链接提交表单，而无需使用提交按钮

<head> 
    <style> 
    div { 
    width: 100px; 
    height: 100px; 
    padding: 10px; 
    margin: 10px; 
    background-color: #EEEEEE; 
    } 
</style> 
</head> 
<body> 
<form name="myform" action="test.php" method="post"> 
<div> 
<a href="javascript: submitform()" value='h1'>h1</a><br> 
<a href="javascript: submitform()" value='h2'>h2</a><br> 
<a href="javascript: submitform()" value='h3'>h3</a><br> 
</div> 
</form> 
<script type="text/javascript"> 
function submitform() 
{ 
    document.myform.submit(); 
} 
</script> 
<div> 
<?php 
$form=$_POST['myform']; 
echo $form.' bla<br>'; 
?> 
</div> 
</body> 
</html>

与奥菲尔巴鲁克suggestions-作品！

<head> 
<script src="jquery.js" type="text/javascript"></script> 
    <style> 
    div { 
    width: 100px; 
    height: 100px; 
    padding: 10px; 
    margin: 10px; 
    background-color: #EEEEEE; 
    } 
</style> 
</head> 
<body> 
<form name="myform" action="test.php" method="post"> 
<input type='hidden' id='hx' name='hx' value=''> 

<div> 
<a href="javascript: submitform('h1')">h1</a><br> 
<a href="javascript: submitform('h2')">h2</a><br> 
<a href="javascript: submitform('h3')">h3</a><br> 
</div> 
</form> 
<script type="text/javascript"> 
function submitform(val) 
{ 
    $("#hx").val(val); 
    document.myform.submit(); 
} 
</script> 
<div> 
<?php 
echo $_POST['hx']; 
?> 
</div> 
</body> 
</html>

来源

2012-03-10 user985456

添加下一行<form...>后：

<input type='hidden' id='hx' name='hx' value=''>

然后，更改您的通话功能：

<a href="javascript: submitform('h1')">h1</a><br>

您的功能：

<script type="text/javascript"> 
function submitform(val) 
{ 
    $("#hx").val(val); 
    document.myform.submit(); 
} 
</script>

在你的PHP

：

echo $_POST['hx'];

它是如何工作的？

1.You点击一个链接

2. js函数改变了隐藏的输入字段的值

3. js函数提交表单

4。$ _ POST涉及隐藏的输入值

来源

2012-03-10 13:15:47

不起作用:(你能在我的例子中显示你的想法吗？ – user985456 2012-03-10 14:25:18

这正是我所做的。你能更具体地说明什么不起作用吗？（得到错误？） – 2012-03-10 14:27:14

我刚刚发布了你的建议的代码，当你点击链接时，它不会返回任何东西 – user985456 2012-03-10 14:54:53

<a href="javascript: submitform('h1')">h1</a> 

function submitform(val) 
{ 
    $.post('.', { myform: val }); 
}

来源

2012-03-10 13:11:45 Anber

不提交表单。它发出一个Ajax请求。 – Quentin 2012-03-10 13:13:22

@Quentin - form.submit（）和$ .post（）做同样的事情：它们对Web服务器执行POST操作。唯一的区别是第二个是异步发布请求。 – 2012-03-10 13:44:49

首先，我不会用href="javascript:submitForm();"，而是使用href="#" onclick="submitForm(this)"

隐藏字段到表单

<input type="hidden" value="" id="hiddenId" />

添加在您的submitForm方法，改变myForm的形式来[0]。我相信这会更加跨浏览器友好。 Anywho ...为您的方法添加一个参数，以便您可以设置隐藏的字段值。

<script type="text/javascript"> 
function submitform(el) 
{ 
    document.getElementById('hiddenId').value = el.value; 
    document.forms[0].submit(el); 
} 
</script>

来源

2012-03-10 13:12:53

它不会更加跨浏览器友好，它仍然不会提交值。 – Quentin 2012-03-10 13:13:48

@Quentin - 是的，您对提交值是正确的。 – 2012-03-10 13:20:41

我已经提出了这种方法。 – 2012-03-10 13:27:59

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
     <script> 
      $(function() { 
       $("form a").click(function() { 
        var value = $(this).data('value'); 
        $.post('.', { myform: value }); 
        return false; 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <form> 
      <a href="" data-value="h1">h1</a> 
      <a href="" data-value="h2">h2</a> 
      <a href="" data-value="h3">h3</a> 
     </form> 
    </body> 
</html>

来源

2012-03-10 13:16:50 Anber

所以我如何得到提交的值？ 'code' <？php $ form = $ _ POST ['myform']; echo $ form。' bla
'; ？''code' – user985456 2012-03-10 14:29:43

阅读** $。post ** [here]（http://api.jquery.com/jQuery.post/）。 – Anber 2012-03-10 14:45:59

通过单击链接提交表单，而无需使用提交按钮

回答

相关问题