Как отключить / включить флажок при щелчке правой кнопкой мыши в Chrome и Firefox

Я написал некоторый код, который позволяет мне отключать / включать флажки, когда я щелкаю их правой кнопкой мыши. Это работает в IE, но не в Chrome или Firefox.

rightClickFunc: function (e) 
{
    var obj;
    if ($.browser.msie) obj = event.srcElement;
    else obj = e.target;
    stuff.disableEnableObject(obj);
    return false;
},

disableEnableObject: function (o)
{
    if (o.getAttribute("disabled") == null)                
          $('#'+o.id).attr("disabled", "disabled");
    else  $('#'+o.id).removeAttr("disabled");
}

Как я могу получить ту же функциональность в Chrome, что и IE? Кажется, проблема в том, что щелчок правой кнопкой мыши на отключенном элементе в Chrome открывает контекстное меню (меню правой кнопки мыши).

Я сделал образец кода - см. http://jsfiddle.net/e72M6/. Запустите его в IE и Chrome, чтобы увидеть разницу. (IE может включить коробки, Chrome не может).

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

3 ответа

Решение

Это будет большая работа, но технически, когда вы отключите элемент, вы можете поместить прозрачный элемент поверх него (чтобы пользователь не мог его видеть), того же размера / формы и прослушать событие click. Когда он включен, скрыть этот сложенный элемент.

Вот кое-что, с чего можно начать: http://jsfiddle.net/8dYXd/2/

Он использует эту структуру:

<span>
    <input id='a' type='checkbox' disabled="disabled" />
    <span class="disabled-detector"></span>
</span>

И этот CSS:

span {
    position: relative;
}

span.disabled-detector {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 0;
}

input+span.disabled-detector {
    display: none;
}

input[disabled]+span.disabled-detector {
    display: inline;
}

Обратите внимание, как вы все еще можете "нажимать" на отключенные элементы.

Вам придется обновить его, чтобы убедиться, что click (или же contextmenu) событие нацелено как на input и прозрачный элемент. Технически, вы можете просто использовать родительский <span> - дать ему специальный класс, и слушать click события на этом. События будут пузыриться от его потомков, так что должно быть в порядке.

Согласно спецификации отключенные элементы не должны реагировать на события нажатия.

То, что вы хотите сделать, это наложить невидимое (opacity: 0) элемент поверх этого и использовать его в качестве прокси для ваших событий. Просто имейте в виду, что некоторые старые браузеры не понимают opacity,

Он работает для отключения элемента, но не для его повторного включения. Это потому, что отключенные элементы не запускают события мыши. Я не думаю, что у вас есть способ заставить это работать во всех браузерах.

Другие вопросы по тегам