onjlick jquery菜单在ajax之后无法正常工作

时间:2012-05-29 12:03:55

标签: jquery css ajax

遇到一些jquery& amp;阿贾克斯。基本上用户登录via表单是ajax。该表单位于jquery onclick下拉菜单中,该菜单也用于购物车菜单(只是更改了命名代码(css + jquery),因此不会相互冲突,并且两者都正常工作,直到用户登录(通过ajax))。

这是下面的jquery代码

//////Cart App
jQuery(".dropdown-cart dt a").click(function() {
        // Change the behaviour of onclick states for links within the menu.
    var toggleId = "#" + this.id.replace(/^link/,"ul");

        // Hides all other menus depending on JQuery id assigned to them
    jQuery(".dropdown-cart dd ul").not(toggleId).hide();

        //Only toggles the menu we want since the menu could be showing and we want to hide it.
    jQuery(toggleId).toggle();

        //Change the css class on the menu header to show the selected class.
    if(jQuery(toggleId).css("display") == "none"){
        jQuery(this).removeClass("selected");
    }else{
        jQuery(this).addClass("selected");
    }
});

jQuery(".dropdown-cart dd ul li a").click(function() {

    // This is the default behaviour for all links within the menus
    var text = jQuery(this).html();
    jQuery(".dropdown-cart dt a span").html(text);
    jQuery(".dropdown-cart dd ul").hide();

});

jQuery(document).bind('click', function(e) {

    // Lets hide the menu when the page is clicked anywhere but the menu.
    var $clicked = jQuery(e.target);
    if (! $clicked.parents().hasClass("dropdown-cart")){
        jQuery(".dropdown-cart dd ul").hide();
            jQuery(".dropdown-cart dt a").removeClass("selected");
        }

});

我尝试了一些.live组合,甚至是.delgate,但仍然在用户登录后登录了&购物车onclick菜单不会工作,直到页面刷新

任何想法??

欢呼声 nz warrior

3 个答案:

答案 0 :(得分:2)

一旦用户通过ajax登录,我猜你正在更新锚标签。所以你之前注册的事件绑定(点击事件)将丢失。您应该使用jQuery on进行绑定,而不是单击

此代码

jQuery(".dropdown-cart dt a").click(function() {
     //remaining code   
});

应该改为

$(document).on("click",".dropdown-cart dt a",function() {
    //remaining code   
});

jquery on适用于当前元素和未来元素,可从jQuery 1.7+版本获得。

答案 1 :(得分:0)

尝试这一点

将代码打包到function并使用onclick事件

在html标记中调用该函数p>

onclick='function_name(this)' --> in your html tag

function function_name(element){
   //your code here
}

答案 2 :(得分:0)

替换:

$(".dropdown-cart dt a").click(function(){})

使用:

jQuery 1.7 +

$(".dropdown-cart").on("click","dt a", function(){})

jQuery 1.4.3 +

$(".dropdown-cart").delegate("dt a", "click", function(){})

jQuery 1.3 +

$(".dropdown-cart dt a").live("click",function(){})

在这种情况下,您不需要绑定新的加载ajax的组件。