如何触发下拉框的onchange事件？

Question

如何触发下拉框的onchange事件？

4

我是一位有用的助手，可以进行文本翻译。

我有一个下拉框，如何触发下拉框的onchange事件并获取所选值。

以下是我目前所做的代码：

<select name="g1" id="select_g1">
        <option value="one">one</option>
        <option value="two">two</option>
        <option value="three">three</option>
    </select>

    <script>
        $(document).ready(function(){

            $("select_g1").change(function(){
                alert("Handled"); // alert is not fired up ...
            });
        });

    </script>

编辑：如果我有多个组合框怎么办：

<select name="g2">
<option value="one">one</option>
<option value="two">two</option>
<option value="three">three</option>
</select>

还需要在组合框g2中禁用组合框g1中选择的值。

请问有谁能告诉我代码哪里有问题。

- k00989

1

你缺少id选择器，请尝试使用 $("#select_g1").change(function(){。 - artm

3个回答

0

尝试

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <title>jQuery Autocomplete</title>
    <meta charset="utf-8">
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script>
    $(document).ready(function(){

        $("#select_g1").on("change",function(){
            alert($(this).val());
        });
    });

</script>
    </head>

    <body>

    <select name="g1" id="select_g1">
    <option value="one">one</option>
    <option value="two">two</option>
    <option value="three">three</option>
  </select>



    </body>

    </html>

- Jenson M John

0

尝试类似这样的代码：

<form class="demo">
<select name="g1" id="select_g1">
    <option value="one">one</option>
    <option value="two">two</option>
    <option value="three">three</option>
</select>
</form>

<script>
 $("#select_g1").change(function () {
    var res = this.value;
    alert(res);
   //OR
    alert(this.value);
    });
</script>

- AkshayP

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Satwik Nadkarny · Accepted Answer

不要尝试使用.change事件，而是请尝试使用.on事件。

您可以像这样尝试使用：

$('#select_g1').on('change', function (e) {
    var optionSelected = $("option:selected", this);
    var valueSelected = this.value;
    alert(valueSelected);
});

请看这里 -> http://jsfiddle.net/ocrozmkn/

编辑：

针对您编辑后的问题，您可以尝试以下jQuery代码：

$('select').on('change', function (e) {
    $('select option').prop('disabled', false);
    var optionSelected = $("option:selected", this);
    var valueSelected = this.value;    
    alert(valueSelected);
    $("select option:contains('" + valueSelected + "')").attr("disabled","disabled");
});

看这里 ->http://jsfiddle.net/ocrozmkn/1/

多个下拉框的演示

查看此处 -> http://jsfiddle.net/ocrozmkn/6/

希望这可以帮助您!!!