Javascript 如何使用jQuery从子类获取值
我正在创建一个简单的五星投票系统,并尝试获取href元素的数值。HTML工作得很好,但我不确定如何获取单击事件的数值 HTML如下所示:Javascript 如何使用jQuery从子类获取值,javascript,jquery,css,Javascript,Jquery,Css,我正在创建一个简单的五星投票系统,并尝试获取href元素的数值。HTML工作得很好,但我不确定如何获取单击事件的数值 HTML如下所示: <div id="voting"> <span class="rating_container"> <span class="star_container"> <a href="#" class="star star_1" >1<span class=
<div id="voting">
<span class="rating_container">
<span class="star_container">
<a href="#" class="star star_1" >1<span class="rating">Terrible</span></a>
<a href="#" class="star star_2" >2<span class="rating">Bad</span></a>
<a href="#" class="star star_3" >3<span class="rating">OK</span></a>
<a href="#" class="star star_4" >4<span class="rating">Good</span></a>
<a href="#" class="star star_5" >5<span class="rating">Great</span></a>
</span>
</span>
</div>
$('.star').click(function(e) {
e.preventDefault();
// How can I get the numeric value of the clicked star (e.g., 5,6,7 etc)
});
这样做:
var n = this.firstChild.data;
或者这个:
var n = this.className.split("_")[1];
如果需要将字符串转换为数字,请添加以下内容:
n = parseInt(n, 10);
我会使用数据标签
非常好,非常好。我想使用很多jQuery…:起初我会要求解释,然后我意识到第一个孩子是span.works之前的textNode。我假设数据只捕捉到了这一点,而忽略了span元素,对吗?@gdoron:谢谢,我喜欢我的“jQuery不够”答案-@保罗:是的,.firstChild是文本节点,.data获取节点的文本值。个人也可以使用.nodeValue而不是.data。做同样的事情。+1表示建议使用[data-*]属性,因为这是正确的解决方案。text也会给出span文本。不是吗?我也将使用+1,因为这是一种更适合未来的方式,以防HTML结构需要更新。@gdoron你是对的。谢谢无法使用.contents并获取文本节点,但这将需要太多的编码
<div id="voting">
<span class="rating_container">
<span class="star_container">
<a href="#" data-val="1" class="star star_1" >1<span class="rating">Terrible</span></a>
<a href="#" data-val="2" class="star star_2" >2<span class="rating">Bad</span></a>
<a href="#" data-val="3" class="star star_3" >3<span class="rating">OK</span></a>
<a href="#" data-val="4" class="star star_4" >4<span class="rating">Good</span></a>
<a href="#" data-val="5" class="star star_5" >5<span class="rating">Great</span></a>
</span>
</span>
</div>
$('.star').click(function(e) {
e.preventDefault();
$(this).data('val'); //should return you the number
});