Question

有没有办法让它如此点击选择输入字段不会打开选项列表？

我尝试从onmousedown和onclick返回false，我尝试在onfocus中调用this.blur（），我尝试设置readonly属性，这似乎都不适用于Firefox。 Chrome和IE似乎更严肃地对待mousedown处理程序中的“return false”。

编辑：我想要做的是实现我自己的界面，从select输入中选择选项。禁用select会更改其外观并防止在控件上触发任何事件。限制为一个选项仍然会在用户点击控件时打开该选项，因此这不是一个好的解决方案。

我想我必须删除select并尝试从文本框和图片中创建一些看起来像这样的内容。

代码（在线here）：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Test searchable select</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#mys").mousedown(function () {
                console.log("mousedown");
                return false;
            }).focus(function() {
                console.log("focus");
                this.blur();
            });
        });
    </script>
<body>
<select style="width: 300px" id="mys" readonly="readonly">
    <option>apple</option>
    <option>banana</option>
</select>

</body>
</html>

Answer 1

为什么不把它disabled？

<select style="width: 300px" id="mys" readonly="readonly" disabled="disabled">
    <!-- ... -->
</select>

Answer 2

<script type="text/javascript">
        $(function() {
            $("#mys").mousedown(function () {
                $(this).val('1');//will close opened list
            })
        });
    </script>

<select style="width: 300px" id="mys" readonly="readonly">
    <option value='1'>apple</option>
</select>

禁用或忽略firefox中选择字段上的mousedown

2 个答案: