jquery context-menu deaktiviert Eingabe

Question

Ich benutze das jquery Kontextmenü-Plugin. Wenn Sie jedoch einen deaktivierten Eingang auswählen, funktioniert das Kontextmenü nicht. Hier ist das Spiel. Das Jsfiddle ist ziemlich selbsterklärend, das disabled Tag, das dem Eingang hinzugefügt wird, lässt das Plugin nicht wie erwartet verhalten.

jsfiddle Und der eigentliche Code

<h1>INPUT DISABLED NOT WORKING</h1> 
<input class='notworking' disabled> 
<h1>REGULAR DIV WORKING</h1> 
<div class="working" style='with:50px;height:50px;background:red;'> 
</div> 

$.contextMenu({ 
selector: 'div.working', 
trigger: 'left', 
callback: function(key, options) {}, 
items: { 
"P9": { 
    name: "Set AAA grade", 
    icon: "edit" 
}, 
"P8": { 
    name: "Set AA grade", 
    icon: "edit" 
}, 
"P7": { 
    name: "Set A grade", 
    icon: "edit" 
}, 
"P6": { 
    name: "Set BBB grade", 
    icon: "edit" 
}, 
"P5": { 
    name: "Set BB grade", 
    icon: "edit" 
}, 
"P4": { 
    name: "Set B grade", 
    icon: "edit" 
}, 
"P3": { 
    name: "Set CCC grade", 
    icon: "edit" 
}, 
"P2": { 
    name: "Set CC grade", 
    icon: "edit" 
}, 
"P1": { 
    name: "Set C grade", 
    icon: "edit" 
    } 
} 
    }); 
$.contextMenu({ 
selector: 'input.notworking', 
trigger: 'left', 
callback: function(key, options) {}, 
items: { 
"P9": { 
    name: "Set AAA grade", 
    icon: "edit" 
}, 
"P8": { 
    name: "Set AA grade", 
    icon: "edit" 
}, 
"P7": { 
    name: "Set A grade", 
    icon: "edit" 
}, 
"P6": { 
    name: "Set BBB grade", 
    icon: "edit" 
}, 
"P5": { 
    name: "Set BB grade", 
    icon: "edit" 
}, 
"P4": { 
    name: "Set B grade", 
    icon: "edit" 
}, 
"P3": { 
    name: "Set CCC grade", 
    icon: "edit" 
}, 
"P2": { 
    name: "Set CC grade", 
    icon: "edit" 
}, 
"P1": { 
    name: "Set C grade", 
    icon: "edit" 
} 
} 
}); 

Answer 1

Browser verhindern deaktiviert Elemente fokussiert werden, überschreibt diese Javascript. Wenn Sie disabled zu readonly ändern, funktioniert das Kontext-Skript und die Eingabe ist weiterhin vor Benutzeränderungen geschützt. Sie können es deaktiviert aussehen lassen, indem Sie einige CSS-Farben hinzufügen (vorzugsweise in Ihrem Stylesheet):