const prices = document.querySelectorAll('.price');
prices.forEach(price => {
price.addEventListener('click', e => {
prices.forEach(el => el.classList.remove('active'));
e.target.classList.add('active');
const currentValue = e.target.value;
})
})
<ul class="money">
<li class="price" data-value="20">20 ฿</li>
<li class="price" data-value="50">50 ฿</li>
<li class="price" data-value="100">100 ฿</li>
<li class="price" data-value="250">250 ฿</li>
<ul>
我的问题:
- 当i改变值时,值被多次存储在currentValue变量中。
- (我想得到1个值)
- 请向我解释,并张贴网站,以获得更多的了解。
3条答案
按热度按时间ct3nt3jp1#
属性
data-value
在脚本中显示为price.dataset.value
:ljsrvy3e2#
e.target.value
用于获取输入元素的值。要获取元素的文本值,需要使用
element.textContent
,如果要从data属性获取值,可以使用element.dataset.value
。juzqafwq3#
你也可以使用element.getAttribute()方法来得到你的值,另外,顺便说一句,你可以使用event delegation来简化你的javascript,而且你只需要在父节点上有一个事件监听器,而不是在每个
li
上都有一个,如下所示: