不使用AJAX的Javascript发布数据

Question

大家好，我在提交以下表单时都带有Anchr标签：

<form id="myForm" action="main/postdata">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br><br>
<a onclick="myFunction()" value="Submit form">click</a>
</form>

<script>
function myFunction()
{
document.getElementById("myForm").submit();
}
</script>

无论如何，我可以在用户单击时在POST数据后附加一个附加值，因此，如果我有2个标签，则可以确定单击了哪个标签？ 例如：

 <form id="myForm" action="main/postdata">
    First name: <input type="text" name="fname"><br>
    Last name: <input type="text" name="lname"><br><br>
    <a onclick="myFunction()" value="Submit form">click</a>  -- ? check which 1 was clicked?
    <a onclick="myFunction()" value="Submit form">click 2 </a>
 </form>

我知道使用按钮执行此操作会更容易-但是我正在寻找JS / JQUERY解决方案（如果有的话），非常感谢！

Answer 1

HTML：

 <form id="myForm" action="main/postdata">
    First name: <input type="text" name="fname"><br>
    Last name: <input type="text" name="lname"><br><br>
    <input type="hidden" value="" id="check_value1" name="check_value1">
    <input type="hidden" value="" id="check_value2" name="check_value2">
    <a onclick="document.getElementById('check_value1').value= 'yes';myFunction()" value="Submit form">click1</a>
    <a onclick="document.getElementById('check_value2').value= 'yes';myFunction()" value="Submit form">click2</a>
    </form>

JS：

function myFunction()
{
  document.getElementById("myForm").submit();
}

当您在服务器端获取POST ED数据时，您单击了选中的一项check_value1或check_value2的值将为“ yes”

Answer 2

您可以在其上更改功能：

<a onclick="myFunctionOnClick()" value="Submit form">click</a>  -- ? check which 1 was clicked?
<a onclick="myFunctionOnClick2()" value="Submit form">click 2 </a>

Answer 3

解决此问题的最佳方法是使用提交按钮而不是JavaScript提交表单。 您可以设置“提交”按钮的样式以使其外观令人满意。

<input type="submit" name="something" value="click">
<input type="submit" name="something" value="click 2">

然后检查服务器上something的值。 只有单击的提交按钮将成功。

---

（更糟糕的是）解决方案是使用JavaScript在提交表单之前向表单添加隐藏的输入。

<a onclick="myFunction(1)" value="Submit form">click</a>  -- ? check which 1 was clicked?
<a onclick="myFunction(2)" value="Submit form">click 2 </a>

function myFunction(id) {
    var frm = document.getElementById("myForm");
    var input = document.createElement("input");
    input.type="hidden";
    input.name="something";
    input.value=id;
    frm.appendChild(input);
    frm.submit();
}

Answer 4

您可以使用隐藏字段，单击更改其值，然后提交表单。 您也可以将参数作为值传递给函数。

因此，您的html可能会像这样：

<form id="myForm" action="myfile.php">
    First name: <input type="text" name="fname"><br>
    Last name: <input type="text" name="lname"><br>
    <a onclick="myFunction('submit1')">click</a>
    <a onclick="myFunction('submit2')">click 2</a>
    <input type="hidden" name="myclick">
 </form>

像这样的jQuery代码：

<script>
function myFunction(btnValue) {
  $("input[name='myclick']").val(btnValue);
  $("myForm").submit();
}
</script>

另外，我已经更改了<form action>值，因为我不理解将其设置为action="main/postdata"想要达到的action="main/postdata" 。 动作应指向目标。