Javascript 如何在键盘上也使用 onclick 功能
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/23800977/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript How to use onclick function also with keyboard
提问by Sascuash
I hope the title of the question fits to what I'm asking here.
我希望问题的标题适合我在这里提出的问题。
I have this code in HTML & javascript:
我在 HTML 和 javascript 中有这个代码:
<button id="Z">Z</button>
var btnZ = document.getElementById("Z");
btnZ.onclick = function() {
// Some code
Ok, now I want to execute btnZ.onclick function when the user press "Z" on keyboard. How can I do this without duplicating the code inside btnZ.onclick function?
好的,现在我想在用户按键盘上的“Z”时执行 btnZ.onclick 函数。如何在不复制 btnZ.onclick 函数中的代码的情况下执行此操作?
回答by jshthornton
You should have a common function which executes the code, but then have two event functions.
您应该有一个执行代码的公共函数,但随后有两个事件函数。
function do() {
//some code
}
btnZ.onclick = function(e) {
do();
};
btnZ.onkeydown = function(e) {
var keyCode = e.keyCode;
if(keyCode === 90) do();
}
This will only work if the user is focused on the element.
这仅在用户专注于元素时才有效。
回答by Al.G.
Use this:
用这个:
function clicked () {
alert('clicked!');
//some code
}
document.onkeydown = function (e) {
var keyCode = e.keyCode;
if(keyCode == 90) {
clicked();
}
};
btnZ.onclick = clicked;
回答by Magus
If you can use HTML5, you can use the accesskey
attribute(but it will respond to ALT + Z, and not Z only).
如果您可以使用 HTML5,则可以使用该accesskey
属性(但它会响应 ALT + Z,而不仅仅是 Z)。
If you can't use HTML5, you must use the keydown
event.
如果您不能使用 HTML5,则必须使用该keydown
事件。
回答by Evan Knowles
You can declare the function separately and just refer to it wherever you need it. For example,
您可以单独声明该函数,只需在需要的地方引用即可。例如,
var yourOnClickFunction = function() {
// Some code
btnZ.onclick = yourOnClickFunction;
回答by Anil Namde
One way is to trigger event of other element as shown in below example
一种方法是触发其他元素的事件,如下例所示
<button >Hello</button>
clickButton = function(){
alert("Hello clicked")
}
document.getElementsByTagName("button")[0].onclick = clickButton
keydown = function(e){
if(e.keyCode==90)
document.getElementsByTagName("button")[0].click()
}
document.onkeydown = keydown
if using JQuery you can use triggerfunction. Following is sample code and also find working example in codepen.io
如果使用 JQuery,您可以使用触发器功能。以下是示例代码,还可以在codepen.io 中找到工作示例
<button >Hello</button>
$("button").click(function(){
alert("Hello clicked")
})
$(document).keypress(function(e){
if(e.charCode == 90)
$("button").trigger("click")
})
回答by jhyap
HTML
HTML
<button id="z">Z</button>
JS
JS
document.onkeypress = function (e) {
e = e || window.event;
var charCode = e.charCode || e.keyCode,
character = String.fromCharCode(charCode);
if (character == 'z')
alert(character);
};
document.getElementById('z').onclick = function (e){
alert(document.getElementById('z').id)
}