如何获取 jQuery Selected drodpown 列表框的 onclick 事件

Question

嗨，我正在开发一个jquery应用程序。我有一个下拉框，选择了jquery。

$(function () {
        $(".limitedNumbSelect").chosen();
    });

这是我的下拉列表和来自数据库的绑定值。

 <b>Awarded To:</b>&nbsp;&nbsp;<asp:ListBox ID="ddlvendorss" runat="server" SelectionMode="Multiple" class="limitedNumbSelect"></asp:ListBox>

我正在尝试获取上述下拉菜单的点击事件。一旦我点击 dropodwn，我想在加载任何选项之前触发警报。

 $('#ddlvendorss').click(function (e) {
            alert("I am going crazy");
        });

在下面的代码中，checkedValues 数组包含一些值（值存在于下拉列表框中）。一旦我点击 drodpown 我就会隐藏这些值。但是下面的代码不起作用。

 $(".chzn-select").chosen().on('chosen:showing_dropdown', function () {
        $(".limitedNumbSelect option").each(function () {
            var val = $(this).val();
            var display = checkedValues.indexOf(val) === -1;
            $(this).toggle(display);
            $('.limitedNumbSelect option[value=' + display + ']').hide();
            $(".limitedNumbSelect").find('option:contains(' + display + ')').remove().end().chosen();
        });
    });

上面的代码不起作用。我可以得到一些建议吗？任何帮助将不胜感激。谢谢。

Answer 1

Selected 隐藏了select元素，因此您实际上并没有单击该元素。但是，您可以使用chosen:showing_dropdown事件

$(".chzn-select").chosen().on('chosen:showing_dropdown', function() {
  alert('No need to go crazy');;
});

小提琴

如果要隐藏选项，可以使用

$(".chzn-select").chosen().on('chosen:showing_dropdown', function() {
    //Find options and hide
    $(this).find('option:lt(3)').hide();
    //Update chosen
    $(this).chosen().trigger("chosen:updated");
});

小提琴

根据OP的代码

$(".chzn-select").chosen().on('chosen:showing_dropdown', function () {
    //Get all options
    var options = $(this).find('option');
    //Show all
    options.show();
    //Hide based on condtion
    options.filter(function () {
        return checkedValues.indexOf($(this).val()) === -1;
    });
    //Update chosen
    $(this).chosen().trigger("chosen:updated");
});

Answer 2

而是在单击时使用，在更改时使用，例如：

 jQuery('#element select').on('change',  (function() {
           //your code here
    }));