jQuery CSS选择器以过滤键盘ENTER键 [英] jQuery CSS Selector to Filter keyboard ENTER key
问题描述
我有一个网页，试图通过使用我在这里看到的jQuery技巧来捕获10和13键的方法来隐藏页面部分中的 ENTER 键代码.
I have a webpage that I am attempting to suppress the ENTER key within a section of the page by using a jQuery trick I have seen on here to catch the 10 and 13 key codes.
<head>
<title>Test Script</title>
<script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('container content input').keypress(function (e) {
if (e.which == 10 || e.which == 13) {
alert('Form Submission needs to occur using the Submit button.');
e.preventDefault(); // should I call preventDefault() or return false?
//return false;
}
});
</script>
</head>
我不知道这个jQuery技巧叫什么，所以我不知道如何查找它以确保我做对了.
I do not know what this jQuery trick is called, so I do not know how to look it up to make sure I am doing it right.
我不想取消 ALL ENTER 键，因为这些键用于触发我们的文件搜索和员工搜索功能:
I do not want to suppress ALL ENTER key presses, because these are used to trigger our File Search and Employee Search features:
<body>
<div class="container">
<div class="header">
<div class="FileSearch">
<!-- Other HTML here -->
</div>
</div>
<div class="content">
<form id="testInput" action="HTMLTestPage1.html" method="post">
<input type="text" name="text1" />
<input type="text" name="text2" />
<input type="text" name="text3" />
<input type="submit" name="Submit" value="Submit" />
</form>
</div>
<div class="footer">
<div class="EmployeeSearch">
<!-- Other HTML here -->
</div>
</div>
</div>
</body>
从我的jQuery语句中可以看到，我正在尝试使用"container content input"值深入挖掘表单.
As you can see from my jQuery statement, I am trying to drill down into form using the "container content input" values.
不过，它似乎运行不佳.每当焦点位于 控件之一上时，每次按 ENTER 键，都会提交表单.
It does not seem to be working well, though. Every time I press the ENTER key when the focus is on one of the controls, the form is submitted.
我想看到我的警报对话框弹出！
I would like to see my alert dialog box pop up instead!
有什么方法可以为jQuery启用断点，以便一个人可以进入正在发生的事情吗?
Is there any way to enable breakpoints for jQuery so a person can step into what is going on?
推荐答案
您的代码看起来非常完美.
Your code look's perfectly fine.
缺少的部分是正确的选择器
The missing part is the right selector
$('container content input')
应该是
$('.container .content input')
您正在基于元素的class属性访问输入.
You are accessing the input based on the class attribute for the element.
并且类选择器必须以.为前缀.
And a class selector has to be prefixed with a . .
如果不是，它将其视为标签.
我应该调用preventDefault()还是返回false?
should I call preventDefault() or return false?
preventDefault()将阻止默认操作.
返回假-等同于 e.preventdefault()和 e.stopPropagation()
要防止表单的提交行为，请删除按钮的类型="submit"，然后单击按钮来提交表单.
To prevent the submit behavior of the form, remove the type="submit" for the button and submit the form on the click of the button.
$('.container .content input').keyup(function (e) {
if (e.which == 10 || e.which == 13) {
alert('Form Submission needs to occur using the Submit button.');
e.preventDefault();
}
});
$('input[name="Submit"]').click(function (e) {
$('#testInput').submit();
});
Check Fiddle
这篇关于jQuery CSS选择器以过滤键盘ENTER键的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
