Question

当用户选择不符合条件的选项时，我想回到上一个选项。例如，这段代码：

    <select onchange="test_condition(this, event);">
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
    </select>

    <script type="text/javascript">

    function test_condition(this_select, event)
    {
         /*If the value of selected option is not equal to 3, 
         come back to the previous option with event.preventDefault(); 
         but this isn't working :*/
         if(this_select.value != 3)
         {event.preventDefault();}
    }

    </script>

因此，如果select标签显示“2”选项（例如）和用户选择“4”选项，然后选择必须显示前一个选项，即“2”选项。但event.preventDefault不起作用。

你有个主意吗？

提前感谢，亲切。

Answer 1

我认为你不能使用event.preventDefault()来阻止select更新onChange;但是，你可以很容易地解决这个问题。您可以使用此jsFiddle来解决我的问题;我保存了以前的值，如果新值不符合我的条件（在这种情况下，如果新值不是＆t; 3），我会将其重新分配给旧值：

$(function () {
  var previous_value = $('#test_select').val();
  test_condition = function test_condition(this_select, event) {
        console.log(this_select.value);
        /*If the value of selected option is not equal to 3, 
         come back to the previous option with event.preventDefault(); 
         but this isn't working :*/
        if (this_select.value != 3) {
            $('#test_select').val(previous_value);
        } else {
            previous_value = this_select.value;
        }
    }
});

我也遇到了test_condition未定义的问题，并通过将其分配给变量来解决这个问题，如上所示。

Answer 2

你可以试试这个

<script>
function test_condition(this_select, event)
{
    var defaultValue = 1;

    if(this_select.value != 3)
    {
        this_select.value = defaultValue;
    }
}
</script>
<select onchange="test_condition(this, event);">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>

Javascript：preventDefault（）无法处理select标签？

2 个答案: