Question

我不想使用input type =“image”或input type =“submit”。在点击时尝试使用img html标签作为提交按钮。 img标签上的click事件和表单上的提交事件有效，但表单未提交。有以下HTML代码

<form id="srch_id_form" name="srch_form" method="post" action="http://phbtxt.com.au:8080/cgi-bin/testpost.cgi" > 
    <img id="srch_id_submitform" src="update.png" />
</form>

粘贴下面的jquery代码。当单击图像但表单未提交时，我收到提示框“表单正在提交”。

$("#srch_id_submitform").click(function(){
    $("#srch_id_form").submit();
});

$("#srch_id_form").submit(function(){
    alert('Form is submitting');
    return true;
});

Answer 1

jQuery选择器和DOM元素之间的区别：jQuery选择器是DOM元素集合的包装器。如果在jquery选择器上调用函数，则调用的函数是jQuery函数。如果需要在DOM元素上调用函数，则必须访问jQuery集合中的DOM元素，并从中调用该函数。要执行此操作，请使用get(index)，其中index是jQuery集合中元素的索引。如果您的jQuery选择器只有一个元素，.get(0)是DOM元素。

submit()是两个非常不同的东西：

在jQuery中，它是一个事件，通常在提交表单时触发（即通常，在提交表单时，触发此事件，如果已为其定义了处理程序，则可以执行某些操作）。如果你在jQuery中调用.submit()，它将触发此事件的所有处理程序......但它不会提交表单。
在DOM元素中，它仅存在于form个元素，并且是一个提交表单的方法

您不必触发submit()事件，而是调用表单DOM元素的submit()方法。

为此，请不要使用jQuery选择器，而是使用DOM表单元素：

$("#srch_id_form").get(0).submit();

get()从jQuery选择器返回DOM元素。

注意：当您使用元素作为img来触发操作时，建议给用户提供视觉线索。您可以使用css cursor样式执行此操作，并在:hover状态（伪类）属性中稍微更改样式。

jquery提交不提交表单

1 个答案: