1

ajax を使用してさまざまなページを読み込むページがあります。もう一方はスクリプトを使用してグレースケール イメージ効果を変換します。グレースケール画像をホバー すると、ロードしようとすると問題が発生します。たとえば、次のような効果はありません。

私のメインページで：

$(function(){
$("#family").click(function () {
    $("#proyects").load('family.html');
});
});

ここにコンテンツを入れます

<div class="ten columns content" id="proyects">

</div>

他のページはグレースケール効果をロードし、単独では正常に動作しますが、ajax でロードすると効果が表示されません

<script src="js/jquery.min.js" type="text/javascript"></script> 
<script src="js/gray.js" type="text/javascript"></script>

    <section id="content">
        <article class="item">
        <a href="#"><img src="images/proyecto1.jpg" height="223" width="327"></a>
         </article>
             </section>
4

3 に答える 3

1

あなたのコード サンプルによると#family、ページが読み込まれるときにタグがないため、click()呼び出しを行っても何にもバインドされません。ページの読み込み後に が読み込まれる場合は、DOM 要素が実際にページに読み込まれるときに適切なイベント バインドを行う呼び出しを#family使用する必要があります。AJAX リクエストを適切に処理するために、 jQuery.ajaxメソッドon('click')を使用することもお勧めします。load()

言い換えると...

$(function(){
    $(document).on('click', '#family', function (event) {
        $.ajax({
            url: '/path/to/family.html'
          , dataType: 'html'
        }).done(function (data) {
            $('#proyects').append(data);
        }); 
    });
});
于 2012-08-21T21:00:14.033 に答える
0

私はこのクラスに精通していませんが、ページが読み込まれた後、画像が ajax を介して読み込まれる前に、gray.js スクリプトが読み込まれているようです。

于 2012-08-21T20:44:18.223 に答える
0

私は AJAX の読み込みにあまり詳しくありません [まったく詳しくありません] が、いくつかの理論があります。

family.html が読み込まれているページに gray.js が読み込まれていないのではないでしょうか? または、jQuery が複数回呼び出された場合 (family.html をロードするページで 1 回、family.html で 1 回)、問題が発生する可能性があります。

于 2012-08-21T20:48:16.187 に答える