Question

我有一个下拉列表

<select id="ddl1">
    <option value="0">number</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
</select>

现在我正在做的是，只要用户点击ddl1我将其默认值更改为4就像这样

$(function () {

    var defaultValue = "4";

    $('#ddl1').click(function () {
        var select_val = $('#ddl1').val();

        if (select_val == "0")
            $('#ddl1').val(defaultValue);
    });
});

但现在问题是当用户尝试选择下拉列表的默认选项，即number时，会选择选项4。任何想法如何解决这个问题？

问题是当用户点击下拉列表时 - ＆gt;必须选择选项4，并且当用户点击选项number时 - >必须选择选项number，而不是选项4。

Answer 1

你应该在change上调用此功能，而不是click - 否则，就像你说的那样，只要你选择了一个选项就可以了。

$('#ddl1').change(function () {

DEMO

编辑：你应该使用一个类来给出默认选项的感觉，你实际上并不希望它设置为用户点击的每个时间选择：

<select id="ddl1">
    <option value="0">number</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4" class="default">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
</select>

.default {
    color: blue;
}

Answer 2

这是你要找的东西吗？ http://jsfiddle.net/swm53ran/84/

$(function () {
    var defaultValue = "4";
    var count = 0;
    $('#ddl1').click(function () {
        if (count < 1) {
            $('#ddl1').val(defaultValue);
            count++;
        }        
    });
});

Answer 3

不确定您为什么这样做，但focusin或focus事件可以帮助您实现以下目标：

$(function() {
    $('#ddl1').on('focusin', function() {
        this.value != 0 || $(this).val( 4 );
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="ddl1">
    <option value="0">number</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
</select>

如何在下拉列表中选择给定选项

3 个答案: