Отключить или игнорировать mousedown в поле выбора в Firefox - PullRequest
Новая
       29

Отключить или игнорировать mousedown в поле выбора в Firefox

3 голосов
/ 23 августа 2009

Есть ли способ сделать так, чтобы щелчок по выбранному полю ввода не открывал список опций?

Я попытался вернуть false из onmousedown и onclick, я попытался вызвать this.blur () в onfocus, я попытался установить атрибут readonly, в Firefox все это не работает. Chrome и IE, похоже, более серьезно относятся к «return false» в обработчике mousedown.

РЕДАКТИРОВАТЬ : я хочу реализовать свой собственный интерфейс для выбора опции из выбора ввода. Отключение выбора изменяет его внешний вид и предотвращает появление каких-либо событий на элементе управления. Ограничение одной опцией все еще делает эту опцию открытой, когда пользователь нажимает на элемент управления, поэтому это не хорошее решение.

Думаю, мне придется удалить select и попытаться создать что-то похожее на текстовое поле и изображение.

Код (онлайн здесь ): 

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

Ответы [ 2 ]

1 голос
/ 23 августа 2009

Почему бы не сделать это disabled? 

<select style="width: 300px" id="mys" readonly="readonly" disabled="disabled">
    <!-- ... -->
</select>
0 голосов
/ 26 марта 2012 
<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>
...