提交按钮并输入关键问题

Question

如果用户专注于任何提交按钮或输入类型文本（如在过滤数据网格中），我正在尝试阻止表单提交。

我正在考虑2种选择

• 用某种<p onclick='submitform&parameters'>Add</p>替换提交按钮
• 阻止按钮上的回车键和一些首选输入字段

有一个更好的方法吗？

Answer 1

如果将onKeyPress事件添加到相关元素，则可以通过从函数返回false来阻止默认操作（表单提交）：

<input id="txt" type="text" onKeyPress="var key = event.keyCode || event.which; if (key == 13) return false;"></input>

请注意，不推荐使用键盘事件的which属性，但您仍需要检查它以支持较旧的用户代理和/或Internet Exploder（ 参考 ）。

如果您不想使用内联javascript（不推荐），则可以改为附加事件。 此外，使用事件对象的preventDefault （ docs ）方法以及stopPropagation方法（ docs ）可能更好 - 这些方法的必要性高度依赖于您附加到表单的其他事件或内容：

var preventFormSubmit = function (event) {
    var key = event.keyCode || event.which;
    if (key != 13)
        return;
    if (event.stopPropagation) event.stopPropagation();
    else event.cancelBubble = true; // deprecated, for older IE
    if (event.preventDefault) event.preventDefault();
    else event.returnValue = false; // deprecated, for older IE
    return false;
};  
var target = document.getElementById('txt');
if (typeof target.addEventListener == 'function')
    target.addEventListener('keypress', preventFormSubmit, false);
else if (typeof target.attachEvent == 'function')
    target.attachEvent('onkeypress', preventFormSubmit);

还有其他方法可供使用，例如将更复杂的onSumit处理程序附加到表单本身 - 如果您在提交之前要对表单或数据进行进一步操作（或使用AJAX提交表单），这可能更合适数据）。

Answer 2

解

input id="txt" type="text" onKeyPress="if (event.which == 13) return false;"></input>

链接

http://stackoverflow.com/questions/1567644/submit-form-problem-enter-key

问题已结束