Question

我需要在我的网络应用程序中使用一些快捷方式，这与用户点击按钮时相同，或者按下带有快捷键的按钮。

我简化了我的代码以向您展示我的问题：

<html>
<head><script src="jquery-1.4.2.js" type="text/javascript"></script></head>
<form>
    <body>
        <div id="myDiv">text</div>
        <input name="cmdChangeText" type="submit" value="change text" onclick="document.getElementById('myDiv').innerText='text is changed'; return false;" />

        <input name="cmdTestButton" type="submit" value="hello" onclick="alert('hello'); return false;" accesskey='z' />
    </body>
</form>
<script type="text/javascript">
    document.onkeydown = function() {
        if (event.keyCode == 83) { //83 = 's'
            window.$('[accesskey=z]').click();
        }
    }
</script>
</html>

第一个按钮可更改文本。当您单击第二个按钮，或通过访问键（IE中的 Alt + Z ）单击它时，您会收到警报，但页面不会重新加载：文本仍然是改变！

当我按下某个按钮，在此示例中的 S 时，我确实收到警报，但页面重新加载！为什么return false;以这种方式被忽略，我该怎么办呢？

Answer 1

我会摆脱onclick="alert('hello'); return false"的东西并使用jQuery附加事件。

之后，您可以尝试取消事件冒泡：

$('#myInput2').click(
    function() {
        alert('hello')
        return false
    }
 )

只是预感。

Answer 2

为按钮指定不同的名称，在本例中我使用了'test1'和'test2'并添加了以下代码。

$('input[name=test1]').click( function(e){
    e.preventDefault();
    $('#myDiv').innerText('text is changed');
});

$('input[name=test2]').click( function(e){
    e.preventDefault();
    alert('hello');
});

“提交”类型的输入将默认提交页面。对事件使用'preventDefault（）'方法会毫不意外地阻止默认操作。如果您想要重新加载页面，请删除此行。

如何使用javascript通过快捷方式单击按钮而不会导致页面重新加载

2 个答案: