PURE JS获取选中的选项数据属性值返回Null

Question

我有这个HTML:

<select onchange="check_status(this);" name="status[171]">    
    <option selected="true" value="open" data="04f2cf35e4d7a1c0158459fd0450a605">open</option>    
    <option value="in_process" data="04f2cf35e4d7a1c0158459fd0450a605">pending</option>    
    <option value="finished" data="04f2cf35e4d7a1c0158459fd0450a605">finished</option>    
    <option value="canceled" data="04f2cf35e4d7a1c0158459fd0450a605">canceled</option>    
</select>    

和js

function check_status(obj){    
    var uid = obj.getAttribute('data');
    alert(uid);
}

但它始终警告null而不是数据值问题伙伴在哪里？谢谢

Answer 1

问题是你得到select元素而没有选择option元素作为函数参数.

function check_status(obj) {
  var uid = obj.options[obj.selectedIndex].getAttribute('data');
  alert(uid);
}

<select onchange="check_status(this);" name="status[171]">

  <option selected="true" value="open" data="04f2cf35e4d7a1c0158459fd0450a605">open</option>
  <option value="in_process" data="04f2cf35e4d7a1c0158459fd0450a605">pending</option>
  <option value="finished" data="04f2cf35e4d7a1c0158459fd0450a605">finished</option>
  <option value="canceled" data="04f2cf35e4d7a1c0158459fd0450a605">canceled</option>
</select>