Предотвращение выбора меню

Возможно, глупый вопрос, но как я могу предотвратить выбор элемента в форме из раскрывающегося меню, когда он нажал? Я попробовал следующее:

$('select').click (function (e) {
    console.log (e);
    return false;
});

а также

$('select').click (function (e) {
    e.preventDefault ();
    console.log (e);
});

Но никто не работал.

Что я делаю не так?

EDIT: Причина, по которой мне нужно знать, - это элемент с улучшенным выбором jquery, который должен грамотно деградировать. Идея заключается в том, что при щелчке открывается выбор, открывается диалоговое окно jquery UI с красивым списком, который пользователь делает своим выбором (щелчок по элементу списка приводит к обновлению значения выбора). Если JS отключен, выбор должен работать как обычно.

Проблема в том, что, как и открытие диалога, появляется раскрывающийся список, чего я не хочу. Я не могу просто отключить контроль, так как его ценность должна быть представлена вместе с остальной формой.

Ответы

Ответ 1

Я считаю, что лучшим решением было бы заменить элемент select на что-то еще, чтобы щелкнуть (кнопка или ссылка).

Кстати, вы можете посмотреть в CSS 3 собственности appearence, которая теоретически позволяет дать, что замена элемент выглядеть раскрывающийся список. Однако поддержка в настоящее время очень ограничена:

Ответ 2

Это должно работать: -

$('#select').on('mousedown', function(e) {
   e.preventDefault();
   this.blur();
   window.focus();
});

Ответ 3

По моему опыту, если мне нужно что-то отключить, самый простой способ иметь на нем еще один невидимый элемент (используйте абсолютное позиционирование). Если вы хотите снова разрешить поведение по умолчанию, вы просто спрячете абсолютный элемент.

Ответ 4

Проблема в том, что вы используете неправильное событие.

<select onmousedown="(function(e){ e.preventDefault(); })(event, this)">
  <option>Some Option</option>
</select>

JsFiddle

Ответ 5

Скрыть параметры выбора при загрузке страницы (если включен Javascript). Они не будут отображаться, когда нажимается кнопка выбора, но текст первого параметра ("Выбрать параметр" или что-то еще) будет отображаться в поле выбора.

$(document).ready(function() {
    $('#idOfSelect option').css('display', 'none');
});

Обновленное решение:

$(document).ready(function() {
    $('#idOfSelect').focusin(function() {
        $(this).css('display', 'none');
        $('body').click(function(event) {
            $(this).unbind(event);
            $('#idOfSelect').css('display', 'block');
        });
    });
});

Ответ 6

Использовать отключено

$(this).attr("disabled","disabled");

Ответ 7

Я просто решил эту точную проблему, манипулируя атрибутом "размер" select. Не очень элегантный, но работал. Надеюсь, что это поможет вам.

<!-- Example select dropdown -->
<select id="select" onclick="tackleDropdown()">
</select>

<!-- The JS function -->
<script>
    function tackleDropdown(){
        document.getElementById('select').setAttribute('size', 0);

        // your code for displaying the jQuery UI dialog (is it colorbox???)

        // re-enabling the drop down
        document.getElementById('select').setAttribute('size', document.getElementById('select').options.length);
    }
</script>

Ответ 8

Вы можете, трюк - отменить событие mousedown, а не щелчок. Цепочка событий выполнена таким образом, что щелчок и мышь не могут возникнуть, если mousedown был отменен:

function cancelDropDown(ev) {
  ev.preventDefault();
}

document.getElementById("selectElement").addEventListener("mousedown", cancelDropDown, false);