1

私は Google Maps API を使用しており、.html() などを使用してスクリプトを介して挿入される多くの html があります。挿入される要素を選択するようにいくつかのトリガーを設定していますが、HTML は '準備完了またはロード済みの場合、選択に失敗します。

私は単純$(window).loadにうまくいくと思っていましたが、そうではないようです。

これまでの私のコードは次のとおりです。

$(window).load(function(){
    $('ul.campaign-list li a').on('click', function (e) {
        $("html, body").animate({ scrollTop: "300px" });
        alert("Scrolls");
    });
});

.live() の代わりに .on を使用していますが、これが正しい方法であると推測しています。alert(); を追加しました。コードをテストするだけですが、残念ながらまだロードされません。

何か案は？

ありがとう、R

4

3 に答える 3

2

編集：

$('#container_12').on('click', 'a', function(){ 
  $('html, body').animate({ 
    scrollTop: 300 
  }, 500); 
});

チャットでの議論の後、問題を特定し、それに応じて修正しました。そのような場合に役立つように、元の回答を保持します.

.on()動的コンテンツで機能させるために使用する場合は、コンテナーまたはコンテキストを指定する必要があります。

$('ul.campaign-list li a').on('click', function (e) {
   $("html, body").animate({ scrollTop: "300px" });
   alert("Scrolls");
 });

になります：

$(window).on('click', 'ul.campaign-list li a', function (e) {
   $("html, body").animate({ scrollTop: "300px" });
   alert("Scrolls");
});

window は、動的に追加されない任意のコンテナーに置き換えることができることに注意してください。

詳細な説明については、 .on()のドキュメントを参照してください。

于 2013-10-03T12:48:14.510 に答える
0

$(window).loadDOM のロード後に実行するコードには使用しないでください。代わりに$(document).ready(function(){...})、またはショートカットを使用してください。$(function(){...})また、.on()呼び出しは、呼び出し時に存在する要素にのみ適用されます。あなたが実際に欲しいのは次のようなものだと思います：

$(function() {
  $('ul.campaign-list').on('click', 'li a', function (e) {
    $("html, body").animate({ scrollTop: "300px" });
    alert("Scrolls");
  });
});

li aこれは、一致する要素内のセレクターに一致するものul.campaign-listがクリックされたときにトリガーされます -ul読み込み時に要素がページの HTML に存在すると仮定します。

古い.live()呼び出しは、次のことと同等です。

$(document).on("click", "ul.campaign-list li a", function(ev) { ... });

それが役立つ場合

于 2013-10-03T12:53:08.613 に答える
0

  1. jquery は別の方法を使用して dom の準備が整っていることを確認するため、代わりに次を$(window).load使用します。

    $( document ).ready(function() {
  // Handler for .ready() called.
});

  2. on を使用する場合、バインド先のコンテナーはページが読み込まれるときに存在する必要があるため、a動的に追加されるクリック イベントをバインドする場合はon、動的ではないコンテナーにをバインドする必要があります。

    $('ul.campaign-list li').on('click','a', function (e) {
    $("html, body").animate({ scrollTop: "300px" });
    alert("Scrolls");
});
于 2013-10-03T12:51:35.840 に答える