-1

.load 関数を呼び出すと、HTML コードが表示されますが<script>、cards.tpl.php のコンテンツ、コードが消去されます。

<script type="text/javascript">
     //anything
</script>
<div style="float:right" class="blah">
<!-- anything -->
</div>

index.php からのコード:

<div id="cards">
     <?php include 'tpl/cards.tpl.php'; ?>
</div>
...
<script type="text/javascript">
    $('#drawCard').click(function(){
            $('#cards').load("tpl/cards.tpl.php",function(){
            });
    });
</script>

PHP にコンテンツが含まれている場合は、<script>. .load がスクリプト タグを実際に削除するのを見ましたが、それらは実行されます。バインドされたイベントは実行後も残りますか?

編集：

わかりました、ついに私はこのすべての背後にある問題の解決策を得ました. <script></script>イベント バインディング コードを含む呼び出しに load() を使用すると、頭の痛い問題が発生します。それをしないでください！$.load() 関数を使用した後のバインドの問題に対処することが実際の問題である場合は、次のことをお勧めします。

すべての click()、on('click') イベントを、livequery('click') を使用して livequery と呼ばれるプラグインに置き換えました。これは 100% 動作します。

新しい質問を開く気分ではありませんが、期待どおりに機能しないのに、JQuery が live() を on() に置き換えるように指示するのはなぜですか?

JAAulde の編集

<div id="cards">
    <!-- this content is replaced -->
    <div value="t1" class="impar tecnologia unselected investigated notUsed">stuff</div>
    </div>
    <!-- end of content replaced-->
</div>

このjQueryコードを使用して：

$("#cards").on('click','.unselected',(function(e){}));

これはロード前に機能し、ロード後に機能しません

4

2 に答える 2

0

jQuery は、DOM に挿入されるコンテンツからすべてのスクリプトを削除し、それらを実行のために HEAD に配置します (その後、何らかの理由で後で HEAD から削除します)。出荷したすべてのスクリプトが挿入され、実行されていることを確認してください。

あなたの編集に答えるには、コレクションで指定されたイベントの処理をオブジェクト.live()に委任するイベントバブリングの巧妙な使用がありました。document

jQueryは、 (docs).live()を導入したときに非推奨になりました。これは、後者を使用すると、常に. これは、そのような委任されたイベントの影響を制限できるため、推奨されます (処理するバブルイベントが少なくなる、ハンドラーへのチェーンのトリップが短くなる、セレクターのマッチング/フィルター処理が少なくなるなど)。.delegate()document

.delegate()イベント API の統合により、それ自体は.on()(docs)に置き換えられました。セレクターを 2 番目のパラメーターとして渡す場合、パラメーター.on()1 で指定されたイベントを、指定されたセレクターに一致する要素にデリゲートするよう jQuery に指示します。

したがって、 へのすべての呼び出しは.live()、適切に範囲指定された への呼び出しに置き換える必要があります.on()。

于 2012-05-21T16:43:25.417 に答える
-1

card.tpl インクルードに $(document).ready(...) がありません。

私はあなたの歴史を振り返って（私があなたにそれをきれいにするように頼んだ後:-p）あなたが投稿した元のコードに戻って、これを見つけました：

<script type="text/javascript">
   $('#toggleMax').click(function(){
      // code
   });
   // more code
</script>

それから私は似たようなものをコーディングしましたが、うまくいきました。私が変更した唯一のことは、コードを document.ready にラップすることでした:

<script type="text/javascript">
   $(function() {  // Note the document.ready call here.
       $('#toggleMax').click(function(){
          // code
       });
       // more code
   });
</script>
于 2012-05-21T14:49:05.413 に答える