使用 Ctrl + Enter 提交表单
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Text Box Enter</title>
<style type="text/css" media="screen">
body {
font: 16px/1.5 helvetica-neue, helvetica, arial, san-serif;
}
textarea {
border: 1px solid #ccc;
display: block;
width: 250px;
height: 100px;
}
p {
border: 1px solid #ccc;
background: #ececec;
padding: 10px;
margin: 10px 0;
width: 230px;
}
button {
border: 1px solid #ccc;
background: #ececec;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
margin-top: 10px;
padding: 5px 20px;
}
</style>
</head>
<body>
<textarea name="msg" id="msg" placeholder="Your Message" autofocus="true"></textarea>
<button type="submit">Post</button>
<script type="text/javascript" charset="utf-8" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8">
$.fn.ctrlEnter = function (btns, fn) {
var thiz = $(this);
btns = $(btns);
function performAction (e) {
fn.call(thiz, e);
};
thiz.bind("keydown", function (e) {
if (e.keyCode === 13 && e.ctrlKey) {
performAction(e);
e.preventDefault();
}
});
btns.bind("click", performAction);
}
$("#msg").ctrlEnter("button", function () {
$("<p class='post'></p>").append(this.val().replace(/\n/g, "<br/>")).fadeIn('slow').prependTo(document.body);
this.val("");
});
</script>
</body>
</html>
分享到：
相关推荐
在JavaScript编程中，有时我们需要模拟用户按下特定键盘组合，例如`Ctrl + Enter`，以便在网页上实现某些功能，如提交表单或执行快捷操作。`Ctrl + Enter`是一个常见的快捷键组合，常用于快速执行某项任务，尤其是在...
javascript实现ctrl+enter键提交表单并且兼容ie和ff以及google浏览器（Chrome）、苹果浏览器（Safari）、360极速浏览器（ie和火狐）
在jQuery中，我们可以监听键盘事件来实现Ctrl + Enter提交表单的功能。这涉及到jQuery的`keydown`事件和JavaScript的`event`对象。`keydown`事件会在用户按下键盘键时触发，而`event`对象包含了与该事件相关的各种...
Ctrl+Enter键按钮提交表单创建标签代码是一款基于jquery textarea输入框实现的键盘创建标签特效代码。演示地址：http://www.datouwang.com/jiaoben/258.html
下面我们将详细介绍如何使用JavaScript来实现在网页中按Ctrl+Enter提交表单。 1. **监听键盘事件**： JavaScript提供`addEventListener`方法来监听用户的键盘事件。我们需要关注`keydown`事件，因为它会在用户按下...
本文实例讲述了jquery实现Ctrl+Enter提交表单的方法。分享给大家供大家参考。具体如下： <!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"&...
"Ctrl+Enter键按钮提交表单代码"是一个关于如何利用前端技术实现用户按下Ctrl+Enter组合键时自动触发表单提交功能的示例。这个压缩包可能包含了一个或多个HTML、CSS、JavaScript和jQuery文件，用于演示这一功能的...
总结来说，通过创建自定义的jQuery插件`ctrlEnter()`，我们可以方便地为textarea添加Ctrl+Enter提交表单的功能。这个功能使得用户在不离开键盘的情况下就能快速提交内容，极大地提升了交互体验。在实际的项目开发中...
Ctrl+Enter 提交允许使用简单的 Ctrl+Enter 提交 Web 表单。... (c) ⇒ :copyright: (r) ⇒ :registered: (tm) ⇒ :trade_mark: ……⇒…… 使用 n-dash 和 m-dash 当您只需要排版而不提交表单时 - 按 shift+Enter
* ctrl+enter提交表单 * @param {Function} fn 操作后执行的函数 * @param {Object} thisObj 指针作用域 */ ctrlSubmit:function(fn,thisObj){ var obj = thisObj || this; var stat = false; return this....
这是因为在某些浏览器中，页面在提交表单后立即重新加载可能会导致无法捕获到onunload事件，从而无法执行相关的清理工作或提示信息。通过延时执行刷新，可以有效解决这一问题。 最后，需要注意的是，由于文档是通过...
// 触发与ctrl+Enter关联的操作，例如提交表单 $("#btn").click(); } // 检查shift+Enter else if (e.shiftKey && (e.which == 13 || e.which == 10)) { // 触发与shift+Enter关联的操作，例如新行添加 $("#...
在本文中，我们将深入探讨jQuery中的键盘事件，特别是如何利用它们来实现特定的功能，如利用Ctrl+Enter组合键提交表单。 首先，键盘事件在JavaScript和jQuery中扮演着重要的角色，它们允许开发者响应用户的键盘输入...
为了实现Ctrl+Enter提交表单，我们需要在JavaScript中添加事件监听器，监听键盘事件。以下是一个简单的示例： ```html <button type="submit" id="submitBtn">Submit document.getElementById('inputField')...
在一些文本框中，**Shift+Enter** 可以在不提交表单的情况下换行。 2. **Ctrl+1, Ctrl+2, ...**：这些快捷键通常用于在含有多个标签或者选项卡的界面中切换到特定编号的标签。 3. **Ctrl+D**：在文本编辑器中，这...
首先，我们来看如何使用jQuery来实现在评论框中按下Ctrl+Enter键就能提交评论。 第一种方法是通过jQuery监听键盘事件。这段代码的核心是监听`keypress`事件，当检测到用户同时按下Ctrl键和Enter键（或者在某些...