问答博客标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
php
java
vue.js
git
html5
python
node.js
android
mysql
react.js
linux
ios
css
golang
spring
docker
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

选中select 里面的某个option时如何触发事件？

头像
zhangwang
    7.9k1615

    如下代码，当我点击按钮时，可以得到option里面弹出value的值，我想问的是如何不点击按钮，直接给option绑定事件，当选中某个option时触发事件，弹出option的value值？

    <html>
<head>
<script type="text/javascript">
function getIndex()
  {
  var x=document.getElementById("mySelect")
  alert(x.options[x.selectedIndex].value);
  }
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
  <option value="20">Apple</option>
  <option value="30">Orange</option>
  <option value="40">Pineapple</option>
  <option value="50">Banana</option>
</select>
<br /><br />
<input type="button" onclick="getIndex()"
value="Alert index of selected option">
</form>

</body>
</html>
    javascripthtml
    阅读 30.2k
    2 个回答
    得票最新
    头像
    hellnpeter
      1.3k115
      ✓ 已被采纳
      <html>
<head>
<script type="text/javascript">
    window.onload = function() {
        var sel = document.getElementById("mySelect");
        if(sel&&sel.addEventListener){
            sel.addEventListener('change',function(e){
                var ev = e||window.event;
                var target = ev.target||ev.srcElement;
                alert(target.value);
            },false)
        }
    }
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
  <option value="20">Apple</option>
  <option value="30">Orange</option>
  <option value="40">Pineapple</option>
  <option value="50">Banana</option>
</select>
<br /><br />
<input type="button" value="Alert index of selected option">
</form>

</body>
</html>
      头像
      sillywolf
        2481

        用jQuery

        $("#mySelect").change(function(){ 
    alert($(this).val());
});
        撰写回答
        你尚未登录，登录后可以
        • 和开发者交流问题的细节
        • 关注并接收问题和回答的更新提醒
        • 参与内容的编辑和改进，让解决方法与时俱进
        推荐问题
        宣传栏