jquery上下文菜单禁用输入

我正在使用jquery上下文菜单插件。但是，在选择禁用的输入时，上下文菜单切换将不起作用。这是jsfiddle。 jsfiddle非常自我解释，disabled标记添加到输入使插件不按预期行为。jquery上下文菜单禁用输入

jsfiddle 和实际代码

<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" 
} 
} 
});

来源

2016-05-22 delmalki

浏览器禁用防止元素被集中，这将覆盖的JavaScript。如果将disabled更改为readonly，则上下文脚本将起作用，并且输入仍受到用户更改的保护。您可以通过添加一些CSS颜色（最好在您的样式表中）使其看起来被禁用（最好在您的样式表中）：

<input class="notworking" readlony style="background:#f0f0f0;border:1px solid #ccc;">

来源

2016-05-22 19:34:36 M4tini

不错，简单并按预期工作。 – delmalki

jquery上下文菜单禁用输入

回答

相关问题