0

私はこれを簡単な例に要約して、私が遭遇していることを実証しようとしました。

入力フィールドと送信ボタンのあるフォームがあります。

<form id="focusOutAfterInputForm">
  <input type="text" id="focusoutAfterInput">
  <input type="submit" >
  <div></div>
</form>

入力フィールドには、入力の下に新しい要素を挿入するフォーカスアウトハンドラーがアタッチされています。

jQuery("#focusoutAfterInput").focusout(function() {
  jQuery(this).after("<div>message</div>");
});

また、送信が実行されたかどうかをキャプチャするために、送信ハンドラーを添付しました。

jQuery("form").submit(function() {
  jQuery("#console").append("<li>submitted form" + this.id + "</li>");
  return false;
});

カーソルが入力に置かれ、送信ボタンがクリックされた場合、送信ハンドラーは起動しません。送信ボタンをもう一度クリックすると、起動します。また、フィールドをぼかして送信ボタンを押すと、フィールドが起動します。

ただし、代わりにフォームのdivの下に新しい要素を挿入すると、要素が挿入されていても送信ボタンが起動します。

<form id="focusoutAfterDivForm" novalidate="novalidate">
  <input type="text" id="focusoutAfterDiv" required="true">
  <input type="submit" >
  <div></div>
</form>

jQuery("#focusoutAfterDiv").focusout(function() {
  jQuery(this).parent().last().after("<div>message</div>");
});

これがコードを示すjsfiddleです。私は少し困惑しています。アイデアは誰ですか？

4

1 に答える 1

1

問題は、送信が実行されないことではなく、divが挿入されると、送信ボタンでマウスアップが実行されないため、ボタンでクリックイベントが実行されないことではないようです。フィドルでタブとスペースを使用すると、機能します。また、送信ボタンが動かないように要素を追加すると、次のように機能します。

jQuery("#focusoutAfterInput").focusout(function() {
  jQuery(this).next().after("<div>message</div>");
});

またはこの例では：http：//jsfiddle.net/K9vrW/3/

于 2012-06-21T19:05:25.720 に答える