1

我有一个看起来像的表格：

<form action="/Soeg.aspx" method="GET" id="searchFormHeader"></form>

在更下方的代码中，我有一个提交按钮，表单由 form="" 触发但是，IE 不支持，然后我尝试在 jQuery 中为 IE 制作解决方案

<input type="submit" form="searchFormHeader" value="Søg" class="site-search-input">

jQuery 解决方案如下所示：

//If IE submit site search form
if ($jq(".ie")) {
    $jq(".site-search-input").click(function () {
        alert("clicked");
        $jq('#searchFormHeader').submit(function () {
            alert('Handler for .submit() called.');
            return false;
        });
    });
}

但是，它永远不会进入 submit()，这没有任何意义吗？

4

4 回答 4

1

您已经为表单提交提供了一个处理程序，但您从未真正提交过表单。称呼：

$jq('#searchFormHeader').submit();
于 2012-06-06T11:50:33.600 回答
0

该submit函数非常类似于click传递的参数是相应事件的事件处理程序。因此，在单击事件的情况下，您似乎正确地钉住了它，但是您在该事件处理程序中唯一要做的就是将事件处理程序附加到 form.submit 事件。您不会触发该事件。

查看您的代码和您的问题，您似乎希望在单击按钮时提交表单。如果是这样，您可以将代码更改为以下

if ($jq(".ie")) {
    $jq('#searchFormHeader').submit(function () {
            alert('Handler for .submit() called.');
            return false;
        });
    $jq(".site-search-input").click(function () {
        alert("clicked");
        $jq('#searchFormHeader').submit();
    });
}

我已将事件处理程序移到单击事件之外，以避免一遍又一遍地附加与事件处理程序相同的函数（每次单击按钮时）。这将确保如果您多次单击该按钮，您不会每次都将事件处理程序附加到提交事件

编辑 没有提交输入值的问题有三个选项

  • 如果您希望支持 IE8-，请将输入移至表单内部。这将是我的首选选项，它很简单，可以消除整个问题。
  • 不使用提交，但使用 $.post 回发
  • 克隆输入元素将其添加到表单并在提交后再次将其删除。我觉得这很骇人听闻

如果你想回帖，你可以做这样的事情

    var form,formId,data,url,id,
    submit = function () {
          //find the form of whatever activated the submitting
          form = $(this).closest("form");
          formId = form.attr('id');
          //iterate all related input fields and collect the data
          //note selects, textareas and checkbox/radiobuttons 
          //needs attention if those are also possible
          data = {};
          $jq("input[form="+formId + "]").each(function(){
                id = this.attr('name') ? this.attr('name') : this.attr('id');
                data[id] = this.val();
          });
          //find the url to post to
          url = form.attr('action') ? form.attr('action') : windows.location;
          //post the data to the server
          //using your original submit event handler as callback
          $jq.post(url,data,function () {
            alert('Handler for .submit() called.');
          });
          return false;
    }

    //make sure they all have a form attribut
    $jq("input").each(function(){
        if(!this.attr('form')){
            formId = this.closest("form").attr('id');
            this.attr('form',formId);
        }
    }

    //attach click event handler to the button
    $jq(".site-search-input").click(submit.call(this))
                             .closest("form")
                             .submit(submit.call(this));
于 2012-06-06T11:55:51.973 回答
0

jQuery函数：

$jq(".site-search-input").click(function () {
    alert("clicked");
    $jq('#searchFormHeader').submit(function () {
        alert('Handler for .submit() called.');
        return false;
    });
});

HTML 元素：

<form action="/Soeg.aspx" method="GET" id="searchFormHeader">

  <input type="submit" form="searchFormHeader" value="Søg" class="site-search-input"/>

</form>
于 2012-06-06T11:56:02.587 回答
0

HTML 代码：

<form action="#" method="POST" id="searchFormHeader">
<input type="submit" form="searchFormHeader" value="Søg" class="site-search-input">
</form>

JQ代码：

$(document).ready(function () {
if ($(".ie")) {
    $(".site-search-input").click(function () {
        alert("clicked");
        $('#searchFormHeader').submit(function () {
            alert('Handler for .submit() called.');
            return false;
        });
    });
}
});
于 2012-06-06T11:57:44.777 回答