用户在下拉列表中进行选择时的 Jquery 事件答案

【问题标题】：Jquery event when user makes selection in dropdown用户在下拉列表中进行选择时的 Jquery 事件
【发布时间】：2012-05-08 08:22:41
【问题描述】：

我有一个下拉列表。在 Jquery 中，当用户进行选择时我会使用什么事件。

下拉列表的id是drp1

我尝试了以下方法，但没有成功：

$("#ddrp1").SelectChanged(SelectionItem);

【问题讨论】：

标签： jquery

【解决方案1】：

使用change() 事件：

$("#ddrp1").change(function() {
    // Pure JS
    var selectedVal = this.value;
    var selectedText = this.options[this.selectedIndex].text;

    // jQuery
    var selectedVal = $(this).find(':selected').val();
    var selectedText = $(this).find(':selected').text();
});

在 jQuery 1.7 中，你可以使用.on()

$("#ddrp1").on("change", function() {
    // Pure JS
    var selectedVal = this.value;
    var selectedText = this.options[this.selectedIndex].text;

    // jQuery
    var selectedVal = $(this).find(':selected').val();
    var selectedText = $(this).find(':selected').text();
});

这里是a working jsFiddle 使用on()

【讨论】：

如何获取文本。在我的情况下，价值返回 5。Thakns

【解决方案2】：

你想要的是onchange事件，可以写成

 $("#ddrp1").change (function () { 
 });

【讨论】：

【解决方案3】：

使用 jQuery change 事件处理程序。

$("#ddrp1").change(function(){
    //selection changed
    alert(this.value);//this will give the selected option's value
    alert($(this).find(':selected').text());//this will give the selected option's text
});

绑定change事件处理程序的另一种方法是。

$("#ddrp1").bind('change', function(){

});

【讨论】：

如何获取文本，在我的情况下 value 返回 5。
要获取所选选项的文本，请使用$(this).find(':selected').text()，这是下拉元素。
谢谢@ShankarSangoli

【解决方案4】：

您需要使用change()。

当一个元素的值改变时会发生jQuery change事件。

此事件仅限于input 元素、textarea 框和select 元素。

$("#ddrp1").change (function () { 

     var getText = $(this).find(':selected').text();
     alert (getText); // show the text value of the selected element ...

 });

【讨论】：