0

これが私が持っているhtmlです

<input type="text" name="post[price]" id="productUpdate" class="test" disabled />
<div class="abs-locator" id="eventDrive"></div>

ここに私のcssがあります

.abs-locator{
  width: 17.8%;
  position: absolute;
  margin-top: -29px;
  margin-left: 150px;
  height: 27px;
}

非表示の入力ボックスがクリックされたときにクリックイベントを実行する必要があります

これが私のjsです

$('#eventDrive').on('click', function() {
    alert('test');
});

しかし、ここでは何も起こりません。なぜこれが起こっているのか、それを解決する方法

4

3 に答える 3

2

Ajax で読み込まれたコンテンツでクリック イベントを発生させるには、コンテナーにイベントを登録する必要があります。私はこのようなことをします：

$(document).on('click', '#eventDrive', function() {
    alert('test');
});

このようにして、クリック リスナーがドキュメント全体に登録され、クリックするたびに #eventDrive をクリックしたかどうかがチェックされます。リスナーを登録した時点でその要素が存在していなかったとしてもです。

于 2013-10-26T19:17:27.627 に答える
0

次のようなものを使用する必要があります。

$(document).on('click', '#eventDrive', function() {
    alert('test');
});
于 2013-10-26T19:17:35.607 に答える
0

無効化された要素は、マウス イベントを発生させません。ほとんどのブラウザーは、無効化された要素から発生したイベントを DOM ツリーに伝播するため、イベント ハンドラーをコンテナー要素に配置できます。

そのための小さな解決策を提案できます。これはベストプラクティスではありませんが、問題を解決します:

HTML:

<div style="display:inline-block; position:relative;">
    <input id="productUpdate" name="post[price]" type="text" disabled />
    <div class="inputOverflow" style="position:absolute; left:0; right:0; top:0; bottom:0;"></div>
</div>

jQuery:

$(".inputOverflow").click(function (evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
});​
于 2013-10-26T19:36:30.450 に答える