删除并存储多个属性

时间:2014-07-02 15:47:42

标签: javascript jquery

我有隐藏的输入可以删除某些池/组中的徽章。

<input type="hidden" name="Remove[<?= $i; ?>][Badge][id]" value="<?= $badge['id']; ?>" data-id="<?= $badge['id']; ?>" />

我对JS和JQuery比较陌生,但到目前为止我还有...

$('.glyphicon-remove').click(function(){
        $(this).parent().toggleClass('remove');
        $(this).siblings().removeAttr("name value data-id");
        return false;
    }); 

问题是,当他们点击.glyphicon-remove我需要它来切换这些属性时。我也玩过JQ函数分离,但是无法将它与attr()标记一起使用。

我需要能够在每次点击时切换每个属性。如果您有任何建议或我是否可以澄清我的问题,请告诉我。

1 个答案:

答案 0 :(得分:0)

您需要某种toggleAttr来保留旧值以进行恢复。 请尝试以下方法:

$('.glyphicon-remove').click(function(){
    $(this).parent().toggleClass('remove');
    var sib = $(this).siblings();
    if ($(this).parent().hasClass('remove')) {
        //Stores attrs to correspontent data-* attribute
        sib.each(function(){
           $(this).data("name", $(this).attr("name"));
           $(this).data("value", $(this).attr("value"));
           $(this).data("data-id", $(this).attr("data-id"));
        });
        sib.removeAttr("name value data-id");
    } else {
        //Restores attrs from the correspondent data-* attribute
        sib.each(function(){
           $(this).attr("name", $(this).data("name"));
           $(this).attr("value", $(this).data("value"));
           $(this).attr("data-id", $(this).data("data-id"));
        });
        sib.removeData("name");
        sib.removeData("value");
        sib.removeData("data-id");
    }
    return false;
});