0

私はjs初心者です。私はこれで隠しdivが表示されますが、ajaxは表示されません.2番目はajaxが機能しますが、直接表示されます-ajaxスクリプトにクリックイベントを含めたいのですが、方法がわかりません:

$(document).ready(function(){
   $(".project-thumbnails a").click(function(event){
    event.preventDefault();
    $('#project-container').slideDown('slow');
    return false;
   });

   $('a.project-close').click(function(event){
    event.preventDefault();
    $('#project-container').slideUp('slow');
    return false;
   });

});

と

jQuery(document).ready(function($) {

    var $mainContent = $("#project-container"),
        siteUrl = "http://" + top.location.host.toString(),
        url = ''; 

    $(document).delegate("a[href^='"+siteUrl+"']:not([href*=/wp-admin/]):not([href*=/wp-login.php]):not([href$=/feed/])", "click", function() {
        location.hash = this.pathname;
        return false;
    }); 
    $("#searchform").submit(function(event) {
        location.hash = '?s=' + $("#s").val();
        event.preventDefault();
    }); 
    $(window).bind('hashchange', function(){
        url = window.location.hash.substring(1); 
        if (!url) {
            return;
        } 
        url = url + " .entry"; 
        $mainContent.animate({opacity: "0.1"}).html('').load(url, function() {
            $mainContent.animate({opacity: "1"});
        });
    });
    $(window).trigger('hashchange');
});

それらをスニペットにどのように組み合わせて、最終的に DIV と AJAX が開き、それをクリックした後にのみ開くことができ、それを閉じることができますか?

4

1 に答える 1

1

最初の解決策は、委任されたイベントを使用することです (.delegate()または.on()セレクターを使用します)。リンク自体にハンドラーを登録する代わりに、ajax スクリプトによって上書き/リロード/追加されていない要素にハンドラーを登録すると、後で追加された要素でも機能します。

2 番目の解決策は、onDOMready (のみ) ではなく onHashchange のハンドラーを登録する関数を実行することです。このイベントは ajax スクリプトによってトリガーされ、新しいコンテンツがあることを示します。ただし、そのソリューションでは、コードが同じ要素でハンドラーを 2 回登録するのを防ぐ必要があるため、最初のハンドラーを使用する必要があります。

于 2012-06-08T10:41:58.160 に答える