Javascript 使用 <a> 标签提交表单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10039968/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Submit form using <a> tag
提问by Potheek
I am trying to submit a form through onclick event on tag. I have tried triggering document.myform.submit(), this.form.submit(), parentNode.submit() etc. but none of this is working! Using a submit button, the code works fine. But I want to use tag in place of that. Need some help.
我正在尝试通过标签上的 onclick 事件提交表单。我曾尝试触发 document.myform.submit()、this.form.submit()、parentNode.submit() 等，但这些都不起作用！使用提交按钮，代码工作正常。但我想用标签来代替它。需要一些帮助。
<form id="myform" name="myform" method="POST" action="process_edit_questionnaire.php?project=<?php echo $project_id; ?>">
<input name="module" type="hidden" value="<?php echo $module_id;?>"/>
<input name="project" type="hidden" value="<?php echo $project_id;?>"/>
<input name="hidden_ques_id" type="hidden" value="<?php echo $data_array_ques[$j]['ques_id'];?>"/>
<div id="question_block">
<div id="serial_block">
<p id="s_original_<?php echo $j+1; ?>"><a href="#" onclick="showSelectBox(<?php echo $j+1; ?>)">Serial :
<?php
if($data_array_ques[$j]['ques_position']==NULL){
echo $j+1;
}
else {
echo $data_array_ques[$j]['ques_position'];
} ?></a></p>
<p id="s_select_box_<?php echo $j+1; ?>" style="display: none;">Serial :
<select name="serial">
<?php for($p=1;$p<=count($data_array_ques);$p++){ ?>
<option value="<?php echo $p; ?>" <?php if($p==$data_array_ques[$j]['ques_position']){ echo "selected=\"selected\"";} ?> ><?php echo $p; ?></option>
<?php } ?>
</select>
</p>
</div>
<div id="question_text">
<a href="#" onclick="showTextBox(<?php echo $j+1; ?>)"><p id="q_original_<?php echo $j+1; ?>"><?php echo $data_array_ques[$j]['ques_text']; ?></p></a>
<p id="q_text_box_<?php echo $j+1; ?>" style="display:none;"><textarea id="ques_text" name="ques_text" rows="3" cols="30"><?php echo $data_array_ques[$j]['ques_text']; ?></textarea></p>
</div>
</div>
<div id="menu_block">
<a href="" onclick="document.myform.submit()">Save Changes</a> |
<a href="delete_question.php?project=<?php echo $project_id; ?>&module=<?php echo $module_id; ?>">Delete This Question</a>
</div>
</form>
回答by krystan honour
you can do it like this with raw javascript
你可以用原始的 javascript 做到这一点
<html>
<body>
<form id="my_form" method="post" action="mailto://[email protected]">
<a href="javascript:{}" onclick="document.getElementById('my_form').submit();">submit</a>
</form>
</body>
</html>
回答by Hemant Nagpal
If jquery is allowed then you can use following code to implement it in the easiest way as :
如果允许 jquery，那么您可以使用以下代码以最简单的方式实现它：
<a href="javascript:$('#form_id').submit();">Login</a>
or
或者
<a href="javascript:$('form').submit()">Login</a>
You can use following line in your head tag () to import jquery into your code
您可以在 head 标记 () 中使用以下行将 jquery 导入到您的代码中
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
回答by Pranay Rana
Submit your form like this ...
像这样提交您的表格...
Your HTML code
你的 HTML 代码
<form name="myform" action="handle-data.php"> Search: <input type='text' name='query' />
<a href="javascript: submitform()">Search</a>
</form>
JavaScript Code
JavaScript 代码
<script type="text/javascript">
function submitform() { document.myform.submit(); }
</script>
回答by Jignesh Rajput
Try this:
尝试这个：
Suppose HTML like this :
假设 HTML 是这样的：
<form id="myform" name="myform" method="POST" action="process_edit_questionnaire.php?project=<?php echo $project_id; ?>">
<div id="question_block">
testing form
</div>
<a href="javascript: submit();">Submit</a>
</form>
JS :
JS：
<script type='text/javascript'>
function submit()
{
document.forms["myform"].submit();
}
</script>
you can check it out here : http://jsfiddle.net/Zm426/7/
你可以在这里查看：http: //jsfiddle.net/Zm426/7/
回答by Nenotlep
Here is how I would do it using vanilla JS
这是我将如何使用 vanilla JS 做到这一点
<form id="myform" method="POST" action="xxx">
<!-- your stuff here -->
<a href="javascript:void()" onclick="document.getElementById('myform').submit();>Ponies await!</a>
</form>
You can play with the return falses and href="#"vs void and whatever you need to but this method worked for me in Chrome 18, IE 9 and Firefox 14 and the rest depends on your javascript mostly.
您可以使用return falses 和href="#"vs void 以及您需要的任何内容，但是这种方法在 Chrome 18、IE 9 和 Firefox 14 中对我有用，其余的主要取决于您的 javascript。
回答by CF5
Is there any reason for not using a submit buttonand then styling it with css to match your other atags?
是否有任何理由不使用提交按钮，然后使用 css 对其进行样式设置以匹配您的其他a标签？
I think this would reduce your dependency on having javascript enabled and still get the desired result.
我认为这会减少您对启用 javascript 的依赖，并且仍然可以获得所需的结果。
回答by Ameni
<form id="myform_id" action="/myMethode" role="form" method="post" >
<a href="javascript:$('#myform_id').submit();" >submit</a>
</form>
回答by Ala Aga
You can use hidden submit button and click it using java script/jquery like this:
您可以使用隐藏的提交按钮并使用 java 脚本/jquery 像这样单击它：
<form id="contactForm" method="post" class="contact-form">
<button type="submit" id="submitBtn" style="display:none;" data-validate="contact-form">Hidden Button</button>
<a href="javascript:;" class="myClass" onclick="$('#submitBtn').click();">Submit</a>
</form>
回答by James
Using Jquery you can do something like this:
使用 Jquery，您可以执行以下操作：
$(document).ready(function() {
$('#btnSubmit').click(function() {
$('#deleteFrm').submit();
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="" id="deleteFrm" method="POST">
<a id="btnSubmit">Submit</a>
</form>回答by Rafael Kutscha
I suggest to use "return false" instead of useing some javascript in the href-tag:
我建议使用“return false”而不是在 href-tag 中使用一些 javascript：
<form id="">
...
</form>
<a href="#" onclick="document.getElementById('myform').submit(); return false;">send form</a>
