jQuery-如何通过onclick div属性检测Java中的Control + Click?

这个问题已经在这里有了答案:

如何使用jQuery单击事件期间检查是否按下了键? 4个答案

我需要知道用户是否单击或控制div元素。我已经看到了有关如何使用事件侦听器执行此操作的示例。但是我的代码已经设置好,并且正在使用on-element onclick方法。

的HTML


blah 
 
 
 
JS
function selectMe(){
//determine if this is a single click, or a cntrol click
}
...也很想知道这是鼠标左键还是鼠标右键。
9个解决方案
73 votes
在处理程序中,检查window.event对象的属性ctrlKey,如下所示:
function selectMe(){
if (window.event.ctrlKey) {
//ctrl was held down during the click
}
}
更新:上述解决方案取决于window对象的专有属性,也许不应将其视为所有浏览器都存在的专有属性。 幸运的是,我们现在有了一份能够满足我们需求的工作草案,据MDN称,该草案得到了广泛支持。 例:
的HTML
Click me
JS
function handler(ev) {
console.log('CTRL pressed during click:', ev.ctrlKey);
}
键盘事件也是如此
也可以看看KeyboardEvent.getModifierState()
Björn Roberg answered 2020-07-28T23:16:05Z
44 votes
我建议在文档上使用JQuery的keyup和keydown方法,以规范化事件代码,从而使一个解决方案成为跨浏览器。
对于右键单击,您可以使用oncontextmenu,但是请注意,它在IE8中可能有问题。 在此处查看兼容性图表:
[HTTP://呜呜呜.quirks摸得.org/Dom/events/context menu.HTML]
Click me
$(document).keydown(function(event){
if(event.which=="17")
cntrlIsPressed = true;
});
$(document).keyup(function(){
cntrlIsPressed = false;
});
var cntrlIsPressed = false;
function selectMe(mouseButton)
{
if(cntrlIsPressed)
{
switch(mouseButton)
{
case 1:
alert("Cntrl + left click");
break;
case 2:
alert("Cntrl + right click");
break;
default:
break;
}
}
}
MasNotsram answered 2020-07-28T23:15:23Z
23 votes
由于第一次提出此问题已经有好几年了,所以其他答案已经过时或不完整。
这是使用jQuery的现代实现的代码:
$( 'div#1' ).on( 'click', function( event ) {
if ( event.ctrlKey ) {
//is ctrl + click
} else {
//normal click
}
} );
至于检测右键单击,这是由另一位用户正确提供的,但我将在此处列出它只是为了将所有内容都放在一个位置。
$( 'div#1' ).on( 'contextmenu', function( event ) {
// right-click handler
} ) ;
Andrew answered 2020-07-28T23:16:34Z
4 votes
鼠标单击时,ctrlKey是事件属性,可以作为e.ctrlKey进行访问。Look down for example
$("xyz").click(function(e)){
if(e.ctrlKey){
//if ctrl key is pressed
}
else{
// if ctrl key is not pressed
}
}
注意:[https://www.w3schools.com/jsref/event_key_keycode.asp]
Kranthi Samala answered 2020-07-28T23:16:58Z
3 votes
试试这个:
var control = false;
$(document).on('keyup keydown', function(e) {
control = e.ctrlKey;
});
$('div#1').on('click', function() {
if (control) {
// control-click
} else {
// single-click
}
});
右键单击会触发contextmenu事件,因此:
$('div#1').on('contextmenu', function() {
// right-click handler
})
Arnelle Balane answered 2020-07-28T23:17:22Z
1 votes
试试这个代码,
$('#1').on('mousedown',function(e) {
if (e.button==0 && e.ctrlKey) {
alert('is Left Click');
} else if (e.button==2 && e.ctrlKey){
alert('is Right Click');
}
});
抱歉,我添加了e.ctrlKey。
Ferhat KOÇER answered 2020-07-28T23:17:46Z
1 votes
纯JavaScript:
var ctrlKeyCode = 17;
document.keydown(function(event){
if(event.which=="17")
cntrlIsPressed = true;
});
document.keyup(function(){
cntrlIsPressed = false;
});
var cntrlIsPressed = false;
function selectMe(mouseButton)
{
if(cntrlIsPressed)
{
switch(mouseButton)
{
case 1:
alert("Cntrl + left click");
break;
case 2:
alert("Cntrl + right click");
break;
default:
break;
}
}
}
jazz answered 2020-07-28T23:18:06Z
0 votes
按下按键后,您无法检测到按键是否按下。 您只能监视js中的关键事件。 在您的情况下,我建议通过按键事件更改onclick,然后按事件键代码检测它是否为控制键,然后可以添加单击事件。
Deez answered 2020-07-28T23:18:26Z
0 votes
仅在上方,只需对其进行编辑,即可立即使用
var control = false;
$(document).on('keyup keydown', function (e) {
control = e.ctrlKey;
});
$(function () {
$('#1x').on('click', function () {
if (control) {
// control-click
alert("Control+Click");
} else {
// single-click
alert("Single Click");
}
});
});
Click me
Arun Prasad E S answered 2020-07-28T23:18:46Z