注意：根据您的评论，这假设您必须收听焦点事件。

解决方案 1 -blur()在 Chrome 中使用 - 有效但有问题

理论上，该focus事件是不可取消的，因此在这种情况下return false或不会产生任何影响。event.preventDefault()但是，在实践中，您可以使用该blur()方法来反转事件。

例如：

$('#select-two').on('focus',function () {
    if ($("#select-one").val() == "") {
        $(this).blur();
        alert('Fill select-one first!');
        return false;
    }
});

参见jsFiddle 演示

这有效地防止了该字段在alert调用后重新获得焦点，因此focus事件不会重复。唯一的问题是，在 Chrome 中，即使该字段不再集中，下拉菜单仍然打开（参见演示）。

解决方案 2 - 使用remove()和clone()- 昂贵但跨浏览器

如果 Chrome 的行为有问题，您可以采取更粗略的方法，即您从 DOM 中取出，remove()然后将其重新插入 DOM。这将有效地完全“重置”元素，使其没有焦点并关闭。selectclone()select

例如：

$(document).on('focus','#select-two',function (e) {
    if ($("#select-one").val() == "") {
        $(this).remove().clone().insertAfter('#select-one');
        alert('Fill select-one first!');
        return false;
    }
});

参见jsFiddle 演示

这种方法的好处是它在 Chrome 中也能很好地工作。这种方法的缺点是它涉及到操纵 DOM 来解决一个非常微不足道的问题。

我认为当 select-one 的值具有“”时，您需要一个额外的事件来更改内容 select-two，如下所示：

HTML

<select id="select-one">
    <option value="">Choose</option>
    <option value="1">House</option>
</select>

<select id="select-two">
    <option value="">Choose</option>
    <option value="A">Table</option>
</select>

JS

$("#select-one").change(function() {
    if ($(this).val() == "") {
        $("#select-two").val("");
    }
});

$("#select-two").focus(function() {
    if( $("#select-one option:selected").val() == "" ) {
        alert("Fill select-one first!");
        $("#select-one").focus();
        return false;
    }
});

演示