1

我的javascript遇到了一个尴尬的问题，基本上我已经编写了以下javascript来删除我页面中动态添加的li标签，但它没有处理，javascript是：

$(document).ready(function(e) 
{
    $(".close").on("click", this, function() 
    {
        $(this).closest("li").remove();
        var panelId = $(this).closest('li').attr('href');
        // $(this).closest('#content').remove();
        // $('#tab1').remove();
        $('#nav-tabs a:last').tab('show');

            $('#close1').on('click',this, function() 
            {
                $('.tab1').remove();
                $('#nav-tabs a:last').tab('show');
            })

            $('#close2').on('click',this, function() 
            {
                $('.tab2').remove();
                $('#nav-tabs a:last').tab('show');
            }) 

            $('#close3').on('click',this, function() 
            {
                $('.tab3').remove();
                $('#nav-tabs a:last').tab('show');
            })


        })
        if(counter <= 1){
            counter = 1;
        }else  {
            counter--;
        }
        return false;
    })
});

问题是当我/用户点击 .close[button has close class] 时，这个 javascript 什么也不做，即使它应该删除最近的 li 标签；此外，当我将其粘贴到添加 javascript[javascript to add li tags] 中时，它开始工作！！！

4

4 回答 4

2

问题是您要删除第li一个，然后再尝试读取其中一个属性。

在完成所有需要访问它或其属性的东西li 之后，您需要删除它。

IE

$(document).ready(function(e) {
    $(document).on("click", ".close", function() {

        var panelId = $(this).closest('li').attr('href'); // get the href first
        $(this).closest("li").remove(); // now delete the li

        ...

    });
});
于 2013-04-22T06:26:46.870 回答
1

尝试这个：

$(document).ready(function(e) 
{
    $(document).on("click", ".close", function() 
    {
        $(this).closest("li").remove();
        var panelId = $(this).closest('li').attr('href');
        // $(this).closest('#content').remove();
        // $('#tab1').remove();
        $('#nav-tabs a:last').tab('show');

            $(document).on('click','#close1', function() 
            {
                $('.tab1').remove();
                $('#nav-tabs a:last').tab('show');
            })

            $(document).on('click','#close2', function() 
            {
                $('.tab2').remove();
                $('#nav-tabs a:last').tab('show');
            }) 

            $(document).on('click','#close3', function() 
            {
                $('.tab3').remove();
                $('#nav-tabs a:last').tab('show');
            })


        })
        if(counter <= 1){
            counter = 1;
        }else  {
            counter--;
        }
        return false;
    })
});
于 2013-04-22T06:25:11.950 回答
0

您在阅读li之前删除了id，所以也panelId将undefined不得不使用基于事件委托的事件处理

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

    $('#close1').on('click', this, function() {
                $('.tab1').remove();
                $('#nav-tabs a:last').tab('show');
            })

    $('#close2').on('click', this, function() {
                $('.tab2').remove();
                $('#nav-tabs a:last').tab('show');
            })

    $('#close3').on('click', this, function() {
                $('.tab3').remove();
                $('#nav-tabs a:last').tab('show');
            })

    $(document).on("click", ".close", function() {
                var panelId = $(this).closest('li').attr('href');
                $(this).closest("li").remove();
                $('#nav-tabs a:last').tab('show');
            })

    if (counter <= 1) {
        counter = 1;
    } else {
        counter--;
    }
    return false;
})
于 2013-04-22T06:27:16.677 回答
0

最明显的原因是当您绑定事件时，.closeDOM 中不存在任何元素。一个简单的解决方案是使用jQuery on()event delegation也可以实现。换句话说，该事件将绑定到另一个元素，即所需目标元素的父元素。这样，您只需绑定一次事件，而不必在运行时的每个新元素上重新绑定它。例如

$(window).click('.close',yourCloseFunction);
于 2013-04-22T06:31:41.753 回答