Question

目前我正在尝试制作它，以便当用户点击链接时，它会通过javascript提交相应的表单。我使用了document.getElementById（＆＃34; id＆＃34;）。submit（）作为如何发送表单的基础，因此我的代码在我的理解中应该与它类似。

以下是代码：

function run(clickedLink){
clickedLink.id.submit();       //I did it like this since document.getElementById just gets the form id and since link and form have similar id's I thought it would send
}

<form id = 'formId'>
<a href = '#' id = 'formId' onclick = run(this)>Link</a>
</form>

我尝试使用name =＆＃39; formId＆＃39;但它仍然没有按照我的意愿运行。

注意：这样做是因为这段代码动态迭代并且id得到更新，即formID1，formID2 ......

实现这一目标的更好方法也是受欢迎的

Answer 1

按如下方式修改您的功能

function run(clickedLink){
  clickedLink.parentNode.submit(); // parentNode refers to the form element
}

Answer 2

您不能在同一页面上为多个元素使用相同的ID。这违反了HTML和DOM规范https://softwareengineering.stackexchange.com/questions/127178/two-html-elements-with-same-id-attribute-how-bad-is-it-really。

如果要重复使用，可以将其更改为class，或者可以更改其他元素的ID本身。此外，不建议链接提交表格。他们的工作是导航

Answer 3

试试这个：

<a href="#" onclick="document.forms[0].v.value='Link1';
document.forms[0].submit();">Link 1</a>

Answer 4

一个基本的东西：

- ID's用于在DOM层次结构中唯一描述元素。请不要重复。（这真的很糟糕）

现在回答：

function run(x){
var y=findParentForm(x); /* if Id's aren't Unique */
// If iD's are Unique :- var y=document.getElementById("formId");
y.submit();
}

function findParentForm(elem){ 
/* 
This function will find exact parent form 
even if link or elem is inside <div> or other complex DOM structure
This will Only return the parent <form> of that elemnt 
*/ 
var parent = elem.parentNode; 
if(parent && parent.tagName != 'FORM'){
parent = findParentForm(parent);
}
return parent;
}

<form id='formId' action="Server Side Script" method="GET/POST">
<a href='#' id='formId' onclick ="run(this);">Link</a> <!-- change id of link -->
</form>

如何通过单击链接javascript提交表单

4 个答案: