Question

我在链接的页面上有2个列表。当我将li元素从列表1拖到列表2时，列表1上的实时事件在第一次单击时不起作用。下面是将li（obj）添加到列表2的代码。

function AddToDropBox(obj) {
    $(obj).children(".handle").animate({ width: "20px" }).children("strong").fadeOut();
    $(obj).children("span:not(.track,.play,.handle,:has(.btn-edit))").fadeOut('fast');
    $(obj).children(".play").css("margin-right", "8px");
    $(obj).css({ "opacity": "0.0", "width": "284px" }).animate({ opacity: "1.0" });
    if ($(".sidebar-drop-box ul").children(".admin-song").length > 0) {
        $(".dropTitle").fadeOut("fast");
        $(".sidebar-drop-box ul.admin-song-list").css("min-height", "0");
    }
    if (typeof SetLinks == 'function') {
        SetLinks();
    }
//CBG Changes adds media ID to hidden field
    //checks id there is a value in field then adds comma
    if(document.getElementById("ctl00_cphBody_hfRemoveMedia").value==""||document.getElementById("ctl00_cphBody_hfRemoveMedia").value==null)
    {
    document.getElementById("ctl00_cphBody_hfRemoveMedia").value=(obj).attr("mediaid");
    }
    else
    {
    var localMediaIDs=document.getElementById("ctl00_cphBody_hfRemoveMedia").value;
    document.getElementById("ctl00_cphBody_hfRemoveMedia").value=localMediaIDs+", "+(obj).attr("mediaid");
    }
//    alert("hfid: "+document.getElementById("ctl00_cphBody_hfRemoveMedia").value);
//END CBG Modifications
}

这是在拖动后第二次点击之前不会触发的live（）事件之一。这个live（）事件在document.ready函数（）中。

// Live for deleting.
    $(".btn-del").live("click", function(e) {
        DeleteItem(this);
        $(this).removeClass("btn-del").addClass("btn-add").parents("li").removeClass("alt").addClass("removed");
        var oldTxt = $(this).parents("li").find(".status").text();
        $(this).parents("li").find(".status").text("Removed").attr("oldstat", oldTxt);
        $("#timeHolder input[type=hidden]").val(($("#timeHolder input[type=hidden]").val() * 1) - ($(this).parents("li").find(".time").attr("length") * 1));
        CalculateAggregates();
        isDirty = false;
    });

修改 @dreaton ..我是jquery和javascript的新手，所以感谢最后一个提示......我不确定你对缓存查询的意思。 ... delegete功能正在向我提供此 Microsoft JScript运行时错误：对象不支持此属性或方法

这就是我拥有代码的方式

$('#ulPlaylist').delegate('.btn-del', 'click', function (e) {
        DeleteItem(this);
        $(this).removeClass("btn-del").addClass("btn-add").parents("li").removeClass("alt").addClass("removed");
        var oldTxt = $(this).parents("li").find(".status").text();
        $(this).parents("li").find(".status").text("Removed").attr("oldstat", oldTxt);
        $("#timeHolder input[type=hidden]").val(($("#timeHolder input[type=hidden]").val() * 1) - ($(this).parents("li").find(".time").attr("length") * 1));
        CalculateAggregates();
        isDirty = false;
    });

更新

拖放后所有jquery和javascript功能似乎都消失了。当我做反向拖放时，处理该事件的javascript函数也会发生火灾。

function AddToLeftList(obj) {
    $(obj).children(".handle").animate({ width: "50px" }).children("strong").fadeIn();
    $(obj).find("span:has(.btn-edit)").hide();
    $(obj).children("span:not(:has(.btn-edit))").fadeIn('fast');
    $(obj).children(".play").css("margin-right", "auto");
    $(obj).children("[smallonly]").remove();
    $(obj).css({ "opacity": "0.0", "width": "610px" }).animate({ opacity: "1.0" });
    CheckLeftList();
    if (typeof SetLinks == 'function') {
        SetLinks();
    }

在不执行的javascript之上。我不确定这有帮助，但我意识到javascript和jquery的所有功能都不会在第一个用户操作上执行。只在第二次之后。

Answer 1

不确定您的HTML结构，很难回答，但我更喜欢使用$ .fn.delegate（）。假设您的父母持有人ID是'parentid'。所以：

$('#parentid').delegate('.btn-del', 'click', function (e) {
    // event handler stuff here
    // this refers to whatever element matches '.btn-del', not the parent element
});

请缓存您的查询：

var $obj = $(obj);

另外，如果你正在使用jQuery，则不需要document.getElementById（'blahblah'）。value;使用方法：

$('#blahblah').val()

.live事件直到第二次点击才起作用

1 个答案: