美文网首页
原生 JS 监听单选框 radio / select 的值 ‘非

原生 JS 监听单选框 radio / select 的值 ‘非

作者: 辣辣不乖 | 来源:发表于2021-12-11 18:01 被阅读0次

HTML片段

<div id="bank">
    <input type="radio" name="a" value="gdyh">光大银行
    <input type="radio" name="a" value="jsyh">建设银行
    <input type="radio" name="a" value="gsyh">工商银行
</div>
<select id="select">
    <option value="pfyh">浦发银行</option>
    <option value="nsyh">农村商业银行</option>
    <option value="qtyh">其他银行</option>
</select>

JS 监听片段

document.getElementById("bank").addEventListener("click", function(e) {
    if (e.target.tagName == "INPUT") {
        console.log("radiovalue", e.target.value)
        var variable = e.target.value
        //......
        //getJson("https://.../api/cnaps/" + variable + ".json")
        //......
    }
})

document.getElementById("select").addEventListener("change", function(e) {
     if (e.target.tagName == "SELECT") {
        console.log("selectvalue", e.target.value)
        //......
    }
})

console 控制台

//点击页面建设银行单选框后 console.log 打印如下
radiovalue jsyh
selectvalue nsyh

非循环方式 原生 JS 监听单选框 radio / select 的值变化

相关文章

网友评论

      本文标题:原生 JS 监听单选框 radio / select 的值 ‘非

      本文链接:https://www.haomeiwen.com/subject/qdnrfrtx.html