jQuery .attr（）多个属性

问题描述：

试图使用.attr函数检索元素的属性。我使用动态创建一个输入元素，并将该值分配给类属性。jQuery .attr（）多个属性

$('.item-selection-amount').click(function(){ 
    console.log($(this).attr('class')); 
});

这将返回：

item-selection-amount ui-corner-all price 
item-selection-amount ui-corner-all 66.00

价格永远是不同的，但有可能拉班的第三属性值如attr('class[2]')等？

我不认为这是好主意，商店的价格在课堂上。因为术语'class'定义了一组元素 – 2011-03-17 04:55:53

答

您正在使用class属性错误。
它旨在用于视觉呈现。

你想要做的是将附加数据到一个元素。

为了这个目的，你可以使用HTML5 data-属性：如果你想价格添加到元素只是呈现HTML类似下面一个服务器上

$('.item-selection-amount').data('price', 66.00); 
// ... later 
$('.item-selection-amount').click(function(){ 
    console.log($(this).data('price')); 
});

：

<li class='item-selection-item' data-price='66.00'>Something</li>

我也这么认为... – 2011-03-17 04:57:50

did not know你可以做到这一点！这很棒。 – goingsideways 2011-03-17 05:08:33

答

如果这个类总是有三个类，那么可以通过空格拆分它们并获得第三个索引。

$(this).attr('class').split(" ")[2];

答

开始也许

var arrClasses = $(this).attr('class').split(" ");

此后，您可以在这个循环，直到你得到一个相匹配的正则表达式，或者，如果你有信心，它会一直处于第3位（而我也不会相信），你可以尝试像你说的，只是用

arrClasses[2]

去得到您的示例中的价格。

答

如果你是积极的总是要在类第三元素，你可以这样做：

$('.item-selection-amount').click(function(){ 
    console.log($(this).attr('class').split(' ')[2]); 
});

这打破了类增长空间，翻出3元。

但是，如果您尝试在“类”字段中存储有关产品的信息。更好的选择是使用HTML5支持的数据属性（并且不会破坏旧的非HTML5浏览器中的任何内容）。例如：

<li class="item-selection-amount" data-price="66.00">My Product</li>

'this.className'，请 - 使用jQuery的超棒力量从单个元素中获取属性并不完全有效 – 2011-03-17 04:58:37

答

您是否将HTML作为CSS类包含在价格中？您不能真正依赖CSS类名称的顺序，除非您将它们设置为HTML并且绝不会在JavaScript中进行更改。你应该使用 .addClass()， .removeClass()一般操作和测试CSS类jQuery中， .toggleClass()和 .hasClass()。

用于存储数据考虑使用数据 - 属性：

<span class="item-selection-amount" data-price="66.00">...</span>

，它很容易与jQuery使用：

$('.item-selection-amount').click(function(){ 
    console.log($(this).data('price')); 
});

见DEMO。你可以使用你现在使用的任何标签来代替span。

答

你可以使用这样

$('.item-selection-amount').click(function(){ 
    console.log($(this).attr('class').split(' ')[2]); 
});

这仅仅是回答你所需要的，但不要把阶级标签的任何数据，

啊，你已经得到了回答，通过“rob waminal”;） – 2011-03-17 05:09:59

jQuery .attr（）多个属性

相关推荐