jquery實現(xiàn)Ctrl+Enter提交表單的方法
更新時間：2015年07月21日 11:05:06 作者：華宰
這篇文章主要介紹了jquery實現(xiàn)Ctrl+Enter提交表單的方法,涉及jquery針對鍵盤按鍵的響應(yīng)與表單操作相關(guān)技巧,非常簡單實用,需要的朋友可以參考下
本文實例講述了jquery實現(xiàn)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>
希望本文所述對大家的jquery程序設(shè)計有所幫助。
您可能感興趣的文章:
- jquery ajax提交表單數(shù)據(jù)的兩種方式
- jQuery ctrl+Enter shift+Enter實現(xiàn)代碼
- jquery ajax提交表單數(shù)據(jù)的兩種實現(xiàn)方法
- jquery下異步提交表單 異步跨域提交表單
- JQuery通過Ajax提交表單并返回結(jié)果
- jQuery Ajax提交表單查詢獲得數(shù)據(jù)實例代碼
- 解決jquery submit()提交表單提示：f[s] is not a function
- jquery中使用$(#form).submit()重寫提交表單無效原因分析及解決
- jquery ajax提交表單從action傳值到j(luò)sp實現(xiàn)小結(jié)
- jQuery ajax中使用serialize()方法提交表單數(shù)據(jù)示例
- Jquery.Form 異步提交表單的簡單實例
- jQuery使用ajaxSubmit()提交表單示例
- jQuery事件之鍵盤事件(ctrl+Enter回車鍵提交表單等)
- jquery動態(tài)改變form屬性提交表單
- 詳解jquery中$.ajax方法提交表單
- jquery+ajax驗證不通過也提交表單問題處理
- jquery ajax 如何向jsp提交表單數(shù)據(jù)
- Jquery中ajax提交表單幾種方法(get、post兩種方法)
- jQuery實現(xiàn)ctrl+enter（回車）提交表單
- 使用JQuery實現(xiàn)Ctrl+Enter提交表單的方法
相關(guān)文章
在上一篇中介紹了jQuery1.4版本新增的幾個瀏覽器特性檢測方案和具體的目的，本文將以事件為中心，介紹一個較為完整、通用的事件檢測方案。2010-11-11
本篇文章小編為大家介紹，基于JQuery 選擇器使用說明介紹。需要的朋友參考下2013-04-04
jquery中文亂碼的多種解決方法，需要的朋友可以參考一下2013-06-06
jQuery Validate表單驗證插件實現(xiàn)代碼
這篇文章主要介紹了jQuery Validate表單驗證插件實現(xiàn)代碼,需要的朋友可以參考下2017-06-06
通過Jquery遍歷Json的兩種數(shù)據(jù)結(jié)構(gòu)的實現(xiàn)代碼
在ajax交互中，我們從服務(wù)器端返回的數(shù)據(jù)類型有xml,html,script,json,jsonp,text，本文以json為例，講述了在前臺如何利用jquery遍歷json的兩種數(shù)據(jù)結(jié)構(gòu)2011-01-01
這篇文章主要為大家詳細(xì)介紹了jquery實現(xiàn)邊框特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-01-01
使用jQuery簡化Ajax開發(fā) Ajax開發(fā)入門
jQuery是一個可以簡化 JavaScript™以及AJAX（Asynchronous JavaScript + XML，異步Javascript和XML）編程的Javascript庫。不同于其他的Javascript庫，jQuery有他自己的哲學(xué)，使你可以 很簡單的編寫代碼。2009-10-10
jQuery中on綁定事件后引發(fā)的事件冒泡問題如何解決
這篇文章主要介紹了jQuery中on綁定事件后引發(fā)的事件冒泡問題及解決辦法，非常不錯，具有參考借鑒價值，感興趣的朋友一起看看吧2016-05-05
2008-01-01
jquery 想必大家早已如雷貫耳，本文整理了一些在實際應(yīng)用中比較常見的功能片段，感興趣的朋友可以學(xué)習(xí)下哦，需要改進(jìn)的地方希望大家不惜指教2013-08-08