jQuery:重命名重复的id

时间:2010-06-08 10:59:03

标签: jquery

我想在一个页面中插入多个滑块。我有一个我想重用的代码块,但它会插入2个DIV与id=slider ...

是否可以找到id=slider的第二个元素并重命名为id=slider01

BR。安德斯

3 个答案:

答案 0 :(得分:5)

尝试

$('div[id="slider"]:eq(1)').attr("id", "slider01");

http://jsfiddle.net/rYyA7/ - 在IE6 / 8,Firefox,Safari,Chrome和Opera中进行了测试。

答案 1 :(得分:5)

最好通过在之前指定新的id 将第二个滑块添加到页面来完成此操作。你还没有展示出你如何做的代码所以很难就如何做到这一点提出建议,但这样做会是最好的。

当您的文档暂时无效时,可以在之后找到第二个滑块,但它可能很笨拙。这又取决于你的代码。如果你已经有一个包含第二个滑块的jQuery对象的引用,作为你创建它的方式的副产品,它很容易(只需使用yourvar[1].id = newavlue)。如果没有,您可能最好根据滑块有的其他内容进行搜索,例如,如果它们与divslider同时出现:

var sliders, ids;
sliders = $("div.slider");
if (sliders.length > 1) {
    ids = {};
    sliders.each(function() {
        if (ids["x" + this.id]) {
            // This ID has already been used, grab a new one
            this.id = 'newslider' + new Date().getTime();
        }
        else {
            // This ID hasn't been used yet; flag that we're using it
            ids["x" + this.id] = true;
        }
    });
}

该代码遍历所有匹配元素,并确保没有重复的ID(有几个警告,主要是“newsliderNNNNNNNNNN”形式中没有ID,其中Ns是{返回的数字} {1}})。 (new Date().getTime()对象中属性名称上的“x”前缀只是为了防止与预先存在的属性(例如ids)发生意外冲突。嘿,它是有效的toString,有人可能使用它。:-))

Andy E's head's answer提供了一种更简短的方法,可能是一种方法,但它假设基于id属性的搜索在某个阶段不会得到优化,它停止寻找多个元素。这个假设可能是有效的,但我依赖于选择器实现而不是在线下更改并在我的代码中引入一个问题,我会感到很不舒服。 (过去几年在选择器方面做了很多工作;例如,当前的jQuery引擎Sizzle是全新的。)但同样,它可能没问题。

答案 2 :(得分:4)

我会这样做:

$('div[id="slider"]').not(':eq(0)').each(function(i){ //selects all divs with the id slider but not the first one
    var $that = $(this),
    newID = $that.attr('id') + (i + 1) // adds a incising number to the ID's 

    $that.attr('id', newID) // sets the new id
})

查看此处的示例: http://jsfiddle.net/nuW34/