如何在选择下拉菜单上触发点击事件

How to fire click event on select drop down

本文关键字：事件 选择 下拉菜单      更新时间：2023-09-26

我有下面的代码下拉选择显示下拉列表使用文本和值。我谷歌了很多代码，但没有一个是可行的。我想在警告对话框中显示选中的下拉菜单项。我已经尝试过jquery和javascript代码，但他们不工作，请帮助我走出这个问题

  <div class="col-sm-1"></div>
            <div class="col-sm-3">
                <div class="fleft " id="drop-down">
                    <select id="cd-dropdown" class="cd-select"  >
                        <option value="1" >Home</option>
                        <option value="2" >Movies</option>
                        <option value="3" >T.V. Shows</option>
                        <option value="4" >Photos</option>
                        <option value="5" >Site Help</option>
                    </select>
                </div>
            </div>

使用JQuery，您可以这样做:

$('#cd-dropdown').bind('change', function () {
   alert($(this).find('option:selected').text());
});

如果您想要的值而不是文本，使用.val()

on change 

$(document).ready(function(){
    $("#cd-dropdown").change(function(){
       alert($(this).find('option:selected').val()); // val or text
    });
});

或加载

$(document).ready(function () {
     alert($("#cd-dropdown").find('option:selected').val()); // val or text
});

更新链接

HTML代码:

 <div class="col-sm-1"></div>
                <div class="col-sm-3">
                    <div class="fleft " id="drop-down">
                        <select id="cd-dropdown" class="cd-select"  onmousedown="this.value='';" onchange="jsFunction(this.value);" >
                            <option value="1" >Home</option>
                            <option value="2" >Movies</option>
                            <option value="3" >T.V. Shows</option>
                            <option value="4" >Photos</option>
                            <option value="5" >Site Help</option>
                        </select>
                    </div>
                </div>

JS代码:

function jsFunction(value)
{
    alert(value);
}

你可以使用jQuery这样做

$(document).on('change',"#cd-dropdown", function(){
 alert($(this).val());  // will display selected option's value
 alert($(this).find('option:selected').text()); //will display selected option's text
});
相关文章：