Html 使用普通链接提交表单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4286466/
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
Use a normal link to submit a form
提问by Upvote
I want to submit a form. But I am not going the basic way of using a input button with submit type but a alink.
我想提交一个表格。但我不会使用带有提交类型的输入按钮，而是使用链接的基本方法。
The image below shows why. I am using image links to save/submit the form. Because I have standart css markup for image links I don't want to use input submit buttons.
下图显示了原因。我正在使用图像链接来保存/提交表单。因为我有图像链接的标准 css 标记，所以我不想使用输入提交按钮。
I tried to apply onClick="document.formName.submit()"to the a element but I would prefer a html method.
我尝试将onClick="document.formName.submit()"应用于 a 元素，但我更喜欢 html 方法。
Any ideas?
有任何想法吗？
回答by Jan Sverre
Two ways. Either create a button and style it so it looks like a link with css, or create a link and use onclick="this.closest('form').submit();return false;".
两种方式。要么创建一个按钮并为其设置样式，使其看起来像一个带有 css 的链接，要么创建一个链接并使用onclick="this.closest('form').submit();return false;".
回答by JonVD
回答by Serj Sagan
Just styling an input type="submit"like this worked for me:
只是设计input type="submit"这样的样式对我有用：
.link-button {
background: none;
border: none;
color: #0066ff;
text-decoration: underline;
cursor: pointer;
}<input type="submit" class="link-button" />Tested in Chrome, IE 7-9, Firefox
在 Chrome、IE 7-9、Firefox 中测试
回答by ThiefMaster
You are using images to submit.. so you can simply use an type="image"input "button":
您正在使用图像提交..所以您可以简单地使用type="image"输入“按钮”：
<input type="image" src="yourimage.png" name="yourinputname" value="yourinputvalue" />
回答by atlavis
use:
用：
<input type="image" src=".."/>
or:
或者：
<button type="send"><img src=".."/> + any html code</button>
plus some CSS
加上一些 CSS
回答by Paulo Buchsbaum
Definitely, there is no solution with pure HTML to submit a form with a link (a) tag. The standard HTML accepts only buttons or images. As some other collaborators have said, one can simulate the appearance of a link using a button, but I guess that's not the purpose of the question.
当然，纯 HTML 没有解决方案来提交带有链接 ( a) 标签的表单。标准 HTML 仅接受按钮或图像。正如其他一些合作者所说，可以使用按钮模拟链接的外观，但我想这不是问题的目的。
IMHO, I believe that the proposed and accepted solution does not work.
恕我直言，我相信提议和接受的解决方案不起作用。
I have tested it on a form and the browser didn't find the reference to the form.
我已经在表单上对其进行了测试，但浏览器没有找到对表单的引用。
So it is possible to solve it using a single line of JavaScript, using thisobject, which references the element being clicked, which is a child node of the form, that needs to be submitted. So this.parentNodeis the form node. After it's just calling submit()method in that form. It's no necessary research from whole document to find the right form.
所以可以用一行 JavaScript 来解决它，使用thisobject，它引用被点击的元素，它是表单的子节点，需要提交。this.parentNode表单节点也是如此。在它只submit()是以这种形式调用方法之后。无需从整个文档中进行研究即可找到正确的形式。
<form action="http://www.greatsolutions.com.br/indexint.htm"
method="get">
<h3> Enter your name</h3>
First Name <input type="text" name="fname" size="30"><br>
Last Name <input type="text" name="lname" size="30"><br>
<a href="#" onclick="this.parentNode.submit();"> Submit here</a>
</form>
Suppose that I enter with my own name:
假设我用自己的名字输入：
I've used getin form method attribute because it's possible to see the right parameters in the URL at loaded page after submit.
我get在表单方法属性中使用过，因为可以在提交后在加载页面的 URL 中看到正确的参数。
http://www.greatsolutions.com.br/indexint.htm?fname=Paulo&lname=Buchsbaum
This solution obviously applies to any tag that accepts the onclickevent or some similar event.
这个解决方案显然适用于任何接受onclick事件或一些类似事件的标签。
thisis a excellent choice to recover the context together with eventvariable(available in all major browsers and IE9 onwards) that can be used directly or passed as an argument to a function.
this是一个很好的选择来恢复上下文和event变量（在所有主要浏览器和 IE9 以后可用），可以直接使用或作为参数传递给函数。
In this case, replace the line with atag by the line below, using the property target, that indicates the element that has started the event.
在这种情况a下，使用target指示已启动事件的元素的属性将带有标记的行替换为下面的行。
<a href="#" onclick="event.target.parentNode.submit();"> Submit here</a>
回答by Sameh Helaly
you can use OnClick="document.getElementById('formID_NOT_NAME').SUBMIT()"
您可以使用 OnClick="document.getElementById('formID_NOT_NAME').SUBMIT()"
回答by Ralph Dingus
pass in the id of the form you want to submit into a function. then submit form
将要提交的表单的 id 传递到函数中。然后提交表格
onclick = "submitForm('myForm')"
<script>
function submitForm(a)
{
document.getElementById(a).submit()
}
</script>
