使用jQuery将ID移动到下一个元素

我想将元素中的ID移动到页面上的下一个select元素。我必须这样做，因为用于编写选择框的软件不允许类或ID直接应用于选择元素。我也希望它是自动的，所以如果我有20个选择框，我没有20个单独的jQuery行。使用jQuery将ID移动到下一个元素

下面是当前的代码：

<div id="stack" class="moveID"> 
    <select name="overflow"> 
     <option value="hi">Hi</option> 
    </select> 
</div>

这里是我想发生什么。

<div class="moveID"> 
    <select name="overflow" id="stack"> 
     <option value="hi">Hi</option> 
    </select> 
</div>

来源

2012-02-01 Ryan Ahlfors

什么你描述的是不是“下一个”元素（这表明下一个兄弟），但直接子元素。你可能是指同一级别的直系孩子或下一个兄弟姐妹。我对吗？ – 2012-02-01 22:24:04

根据您的要求，为与类moveID所有项目自动执行此，您可以使用此：

$('.moveID').each(function() { 
    var id = this.id; 
    $(this).removeAttr('id').children().first().attr('id', id); 
});

来源

2012-02-01 22:28:30 jfriend00

+1使用'removeAttr'并继续链接是最优雅的方式。 – 2012-02-01 22:32:03

@AtesGoral，但不像使用DOM方法那样高效 - 有时候jQuery会让人忘记它可能会有多容易...... – Alnitak 2012-02-01 22:37:28

而且我们需要一个innerHTML + RegExp解决方案来演示远端。 – 2012-02-01 22:41:14

-1

这应做到：

$('.moveID').each(function() { 
    // record current ID 
    var id = this.id; 

    // find the first HTMLElement inside 
    var child = this.firstChild; 
    while (child && child.nodeType != 1) { 
     child = child.nextSibling; 
    } 

    // if found, swap the IDs 
    if (child) { 
     this.removeAttribute('id'); 
     child.setAttribute('id', id); 
    } 
});

见http://jsfiddle.net/dqN8n/3/

它使用了jQuery找出移动的元素，但后来使用本地DOM方法来实际进行更改。这将大大比较有效的替代方案：

$('.moveID').each(function() { 
    var id = this.id; 
    $(this).removeAttr('id').children().first().attr('id', id); 
}

，因为没有创造大量的中间的jQuery对象的，并有（最多）两个函数调用而不是5。

来源

2012-02-01 22:24:08 Alnitak

这不符合“我也希望它是自动的，所以如果我有20个选择框，我没有20个独立的jQuery行。” – 2012-02-01 22:27:03

@KyleMacey哎呀，错过了那一点...现在修复 – Alnitak 2012-02-01 22:29:11

@ downvoters - 请再看一遍。 – Alnitak 2012-02-01 22:32:22

$.each($('.moveID'), function(){ 
    var moveTo = $(this + ':first-child'); 
    $(moveTo).attr('id', $(this).attr('id')); 
    $(this).removeAttr('id'); 
})

来源

2012-02-01 22:26:32

这假定所有输入元素都会有“溢出”的名称 – 2012-02-01 22:29:59

上次编辑，然后我出去了。这太淹没了。每个人都在争先恐后地得到答案。我自己包括 – 2012-02-01 22:35:33

假设每个选择元素有一个.moveID（直接）包装：

$("select").each(function() { 

    // or this.id = $(this).closest(".moveID")[0].id; 
    this.id = $(this).parent()[0].id; 
    $(this).parent().removeAttr("id"); 
});

来源

2012-02-01 22:28:56 karim79

var id= $(".moveID").attr("id"); 
$(".moveID").removeAttr("id").find("select").attr("id",id);

当然，这会将相同的ID添加到许多select中，这是不好的。所以，你可能需要使用类来代替：

var id= $(".moveID").attr("id"); 
$(".moveID").removeAttr("id").find("select").addClass(id);

（更新）

来源

2012-02-01 22:29:34 Daniel

使用jQuery将ID移动到下一个元素

回答

相关问题