jquery重命名所有属性[重复]

Question

可能重复：
How can I change HTML attribute names with jQuery?

我有一个大型/复杂的表格，其中包含基于先前选择的问题的不同可用问题。

为了尽量保持井井有条，我有几个相同名称的重复输入。这会产生问题，即使页面下方的输入被隐藏，也会覆盖可见输入。

为了防止这种情况，我将所有隐藏输入设置为 data-name 而不是 name 属性。

问题 如何更改属性名称。例如：

<input data-name="phone" value="" />
<input data-name="email" value="" />

To
<input name="phone" value="" />
<input name="email" value="" />

Answer 1

鉴于上述 HTML 标记，我建议：

$('input').each(
    function(i,el){
        var data = $(el).data();
        for (datum in data) {
            if (!el[datum]) {
                el[datum] = data[datum];
                el.removeAttribute('data-' + datum);
            }
        }
    });​

JS Fiddle demo.

这使用 jQuery data() 方法创建一个对象，其中包含数据（如果有的话）附加到由 each() 方法迭代的当前 jQuery 对象。

实际上，在上面的示例中，if 检查当前元素是否还没有同名的属性（因此如果 name 已经存在，则不会被覆盖），如果它不存在，创建该属性/属性。

显式覆盖预先存在的属性：

$('input').each(
    function(i, el) {
        var data = $(el).data();
        for (datum in data) {
            el[datum] = data[datum];
            el.removeAttribute('data-' + datum);
        }
    });​

JS Fiddle demo.

参考资料：

• data()。
• each()。
• removeAttribute()。

Answer 2

$('input[data-name]').each(function(){
    $(this).attr('name', $(this).attr('data-name')); //does the switch
    $(this).removeAttr('data-name'); //clears out the old one if you need to
});