Anwenden von jQuery-Listenern auf untergeordnete Elemente des Elements

Question

Ich habe eine Schaltfläche mit einem jQuery contextmenu Listener.

Wenn Sie in Safari und Chrome mit der rechten Maustaste auf die Schaltfläche klicken, wird der Hintergrund für eine Sekunde blau und der Text innerhalb der Schaltfläche wird ausgewählt/hervorgehoben.

Wie kann ich das verhindern?

jQuery(".class1").contextmenu(function (e) { 
 
    return false; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button class="class1">Click Me</button>

Answer 1

Wenn das Problem Text innerhalb der Schaltfläche Auswählen können Sie noselect Klasse auf eine Schaltfläche hinzufügen möchten, müssen Sie nicht js dafür verwenden. Aber vielleicht liege ich falsch.

.noselect { 
    -webkit-touch-callout: none; /* iOS Safari */ 
    -webkit-user-select: none; /* Chrome/Safari/Opera */ 
    -khtml-user-select: none; /* Konqueror */ 
    -moz-user-select: none;  /* Firefox */ 
    -ms-user-select: none;  /* Internet Explorer/Edge */ 
    user-select: none;   /* Non-prefixed version, currently 
            not supported by any browser */ 
} 

.noselect { 
 
    -webkit-touch-callout: none; /* iOS Safari */ 
 
    -webkit-user-select: none; /* Chrome/Safari/Opera */ 
 
    -khtml-user-select: none; /* Konqueror */ 
 
    -moz-user-select: none;  /* Firefox */ 
 
    -ms-user-select: none;  /* Internet Explorer/Edge */ 
 
    user-select: none;   /* Non-prefixed version, currently 
 
            not supported by any browser */ 
 
} 
 
/*maybe give it a static background .. */ 
 
button{ 
 
    background:yellow; 
 
} 
 
button:active{ 
 
    background:yellow!important; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button class="class1 noselect">Click Me</button>

Answer 2

In einem Kommentar erwähnt, Sie auf einem Mac sind, der blaue Hintergrund/Grenze sein könnte, weil Sie STRG + LMB zu klicken verwenden.

Dies wird den Fokus auf die Schaltfläche entfernen, wenn CTRL gedrückt wird:

jQuery(".class1").contextmenu(function(e) { 
 
    return false; 
 
}).keydown(function(e) { 
 
    if (e.keyCode == 17) { //CTRL 
 
    $(this).blur(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button class="class1">Click Me</button>