Javascript:preventDefault（）不处理select标记？

当用户选择不满足条件的选项时，我想回到上一个选项。例如，此代码：

    <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不起作用

你有主意吗

提前衷心感谢。

您可以试试这个

<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>

我认为您不能使用event.preventDefault来阻止select更新onChange；然而，你可以很容易地解决这个问题。你可以用这个来解决我的问题；我保存了以前的值，如果新值与我的条件不匹配（在本例中），如果新值不是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;
        }
    }
});

---

我还遇到了一个没有定义测试条件的问题，并通过将其分配给一个变量（如上所示）解决了这个问题。

说：可取消：否。改为设置selectedIndex。谢谢您的评论。的确，MDN说select标记是不可取消的。但我不知道如何使用selectedIndex来获得预期的结果。你能举个例子吗？。如果要重用该函数，则可以传递正确的索引以及元素和事件对象。感谢您的回复，但您的代码不是我所期望的：例如，当选择显示选项1时，我选择了选项2，例如，select必须显示选项1，因为选项2不等于3。但这只是一个示例，如何使用selectedIndex，而不是对您的问题的直接回答。非常感谢，您的代码正在运行，但我必须在不使用jquery的情况下编码，仅使用纯javascript。有可能吗？@ToToOAussi检查一下这个新提琴-它使用document.getElementById'test_select'.value=previous_value而不是jQuery的$'test_select'.val…。非常感谢您，它的工作非常感谢您。但遗憾的是，第一个回复用户Truong Hua的代码在Internet Explorer中不起作用。谢谢，但您的代码仅在chrome、firefox中起作用，在Internet Explorer中不起作用。选择标记显示一个空选项，而不是上一个选项。