获取数据属性值

Question

我正在使用下面的代码来获取数据属性值。但不管我选择了什么，我只得到foreach循环的第一个值。

foreach($values as $opvalue){
            ?>
            <?php  echo $opvalue->getTitle(); ?>
            <?php echo $opvalue->getId(); ?>
            <input type="radio" data-sareeid="<?php echo $opvalue->getId(); ?>" id ="sareefinishing" name="sareefinishing" value="<?php echo $opvalue->getTitle(); ?>" />

        <?php
        }

JavaScript代码：

var sareeOption = document.getElementById('sareefinishing');
    alert(sareeOption.dataset.sareeid);

从下图中，它始终提醒61818。 相关问题here

Answer 1

我的代码中的ID应该是唯一的，否则它将始终选择第一个。所以你需要使用课程。你被标记为jQuery，所以使用 data()

做这样的事情

var sareeOption = $('.sareefinishing:checked');
alert(sareeOption.data('sareeid'));

Answer 2

fiddle

$("input[name=qwe]").change(function(){
if($(this).is(':checked')){
    alert($(this).val())
}
})

您可以这样做，使用名称然后更改单选按钮获取值然后提醒它

Answer 3

您不能在任何给定文档中包含重复的ID。因此，使用类。这是一个纯粹的JavaScript解决方案。

＆＃13;

＆＃13;

var radios = document.querySelectorAll('.sareefinishing');
[].forEach.call(radios, function(radio) {
  radio.addEventListener("change", function() {
      alert (this.dataset.sareeid);
  }, false);
});

＆＃13;

<input type="radio" class="sareefinishing" data-sareeid="10" name="sareefinishing" value="10" />
<input type="radio" class="sareefinishing" data-sareeid="20" name="sareefinishing" value="20" />
<input type="radio" class="sareefinishing" data-sareeid="30" name="sareefinishing" value="30" />
<input type="radio" class="sareefinishing" data-sareeid="40" name="sareefinishing" value="40" />

＆＃13;

＆＃13;

＆＃13;

Another demo，它会在按钮点击时显示所选单选按钮的sareeid。