javascript - 用 jquery 删除最后一个 Accordion

标签 javascript jquery html

我可以使用 jQuery 添加 Accordion 。但现在我还想删除最后选择的 Accordion 。我有这样的: HTML:

<div class="span12" id="delete-contact">
    <p style="text-align: center;">
        <a href="#">Klik hier om contactpersoon te verwijderen</a>
    </p>
</div>

jQuery:

$('#delete-contact p a').click(function() {
    $(this).parents('.panel').get(0).remove();
});

但这行不通

这是 html:

 <div class="span12" id="add-contact">
          <p style="text-align: center;">
            <a href="#">Klik hier om nog een contactpersoon toe te voegen</a>
          </p>
        </div>
        <div class="span12" id="delete-contact">
          <p style="text-align: center;">
            <a href="#">Klik hier om contactpersoon te verwijderen</a>
          </p>
        </div>

这是用于添加和删除 Accordion :

// Add extra contact clicked?
                                $('#add-contact p a').click(function()
                                {
                                    // Make a copy of the first input fields
                                    html = $('#new-contact').children().clone();

                        // Get number of tabs in the accordion
                        var index = $('#accordion h3').length;



                    if(index == 0 )
{
                         alert($('#accordion h3').length);
                        $('#contactpersonen_canorder_0').prop('checked', true);
                        $('#contactpersonen_canseestock_0').prop('checked', true);
                        $('#contactpersonen_canseeorders_0').prop('checked', true);
                        $('#contactpersonen_canaddaddress_0').prop('checked', true);
                        $('#contactpersonen_canseeprice_0').prop('checked', true);
                        $('#contactpersonen_canseecredit_0').prop('checked', true);
                        $('#contactpersonen_canseepickup_0').prop('checked', true);

}               


                                    // Remove the values
                                    html.find("input[type=text]").val("");
                  html.find('input[type=checkbox]').attr('checked', false);

                        // New 'id', 'for' and 'name' attribute names
                        html.find('input[type=checkbox]').each(function () {
                            me = $(this);
                            attr = me.attr('id');
                            number = attr.split('_')[2];
                            newNumber = parseInt(index) + 1;
                            newAttr = attr.replace(number, newNumber);
                            me.attr('id', newAttr).attr('name', newAttr).next().attr('for', newAttr);
                        });                  

                                    // Insert it at the end
                        $('#accordion').append(html);
                        $('#accordion').accordion('refresh');

                        // Set last tab to active
                        $("#accordion").accordion({ active: index });

                                    // Cancel the click
                                    return false;
                                });


                            $('#delete-contact p a').click(function(event)
                                {
                                        event.preventDefault();
    $(this).parents('.panel').eq(0).remove();
          //$("#accordion).accordion("destroy");    // Removes the accordion bits
         //$("#accordion").empty();  



                                    });

如果我这样做:

$('#delete-contact p a').click(function(event)
                                {
                                        event.preventDefault();
    //$(this).parents('.panel').eq(0).remove();
         // $("#accordion).accordion("destroy");    // Removes the accordion bits
         $("#accordion").empty();      


                                    });

然后所有 Accordion 将被删除。例如,我有两个 Accordion ,最后一个 - 必须删除两个。但现在两者都将被删除。

我尝试这样:

$('#delete-contact p a').click(function(event)
                                {
                                        event.preventDefault();
    //$(this).parents('.panel').eq(0).remove();
        // $("#accordion).accordion("destroy");    // Removes the accordion bits
         $("#accordion").empty({ active: index });  

但现在两个 Accordion 都不会被删除

            });

最佳答案

对于链接点击时的页面重定向问题,请尝试以下操作:

<a href="#">Klik hier om nog een contactpersoon toe te voegen</a>

将 href 属性替换为“javascript:void(0)”,这将阻止页面加载。

例如。 :

<a href="javascript:void(0);">Klik hier om nog een contactpersoon toe te voegen</a>

关于javascript - 用 jquery 删除最后一个 Accordion ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35626938/

相关文章:

javascript - 使用 Azure VM Javascript SDK 从 RunCommand 获取 StdOut

javascript - 如何使动画关闭与打开相同

javascript - string split and check if parts 以防止错误

javascript - jQuery 兼容性的最佳实践

javascript - 通过单击所选的 div 来填充输入

java - 使用 JSoup 用字母替换标签

javascript - 嵌套 ng-repeat 索引不起作用 ||嵌套 ng-click 不起作用

javascript - 需要 javascript 正则表达式来表示金额和小数以及百分比增加

javascript - 正则表达式仅删除第一个实例

javascript - Vue中没有定义axios