1

次のようなフォームがあります。

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

さらに下のコードには、送信ボタンがあり、フォームは form="" によってトリガーされます。

<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();
    });
}

イベント ハンドラーをクリック イベントの外に移動して、同じ関数をイベント ハンドラーとして何度も (ボタンがクリックされるたびに) アタッチすることを回避しました。これにより、ボタンを複数回クリックした場合に、毎回イベント ハンドラーを送信イベントにアタッチする必要がなくなります。

EDIT 入力値が送信されないという問題には、3つのオプションがあります

  • IE8 をサポートする場合は、入力をフォーム内に移動します。これは私の好みのオプションであり、単純で問題全体を排除します。
  • submit を使用せず、$.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 に答える