jQuery实现ctrl+enter（回车）提交表单

以jQuery插件开发的方法开发。具体代码如下：

jQuery.fn.extend({
  /**
   * ctrl+enter提交表单
   * @param {Function} fn 操作后执行的函数
   * @param {Object} thisObj 指针作用域
   */
  ctrlSubmit:function(fn,thisObj){
    var obj = thisObj || this;
    var stat = false;
    return this.each(function(){
      $(this).keyup(function(event){
        //只按下ctrl情况，等待enter键的按下
        if(event.keyCode == 17){
          stat = true;
          //取消等待
          setTimeout(function(){
            stat = false;
          },300);
        }
        if(event.keyCode == 13 && (stat || event.ctrlKey)){
          fn.call(obj,event);
        }
      });
    });
  }
});

使用方法：

$("#textarea").ctrlSubmit(function(event){
  //提交代码写在这里
});

是不是非常的简单实用呢，希望大家能够喜欢。

赞 (0)

相关推荐

  • 使用JQuery实现Ctrl+Enter提交表单的方法

    有时候我们为了省事就操作键盘组合键去代替使用鼠标,我们今天就使用JQuery实现Ctrl+Enter提交表单. 我们发帖时,在内容输入框中输入完内容后,可以点击"提交"按钮来发表内容.可是,如果你够"懒",你可以不用动鼠标,只需按住键盘上的Ctrl+Enter键,即可提交表单,完成内容发布. 当然,由于输入框是一个多行文本输入框textarea,我们知道,在textarea中按Enter(回车)键可以换行,并不能直接提交表单(submit),而默认情况下,浏览器忽略

  • jQuery Real Person验证码插件防止表单自动提交

    jQuery Real Person验证码插件防止表单自动提交

    本文介绍的jQuery插件有点特殊,防自动提交表单的验证工具,就是我们经常用到的验证码工具,先给大家看看效果. 效果图如下: 使用说明 需要使用jQuery库文件和Real Person库文件 同时需要自定义验证码显示的CSS样式 使用实例 1.包含文件部分 <script type="text/javascript" src="jquery-latest.pack.js"></script> <script type="te

  • jquery验证邮箱格式并显示提交按钮

    jquery验证邮箱格式并显示提交按钮

    简要教程 简洁.大方和直观的用户界面是我们最喜欢的网页设计.本文介绍的正是这样的一个设计风格. 如何才能做到页面的简洁大方并且人性化?大多数网站的表单采用文本提示的方法,提示用户哪里填写错了,哪里不正确,但我们应该能做得更好:填写不正确就不显示提交按钮! HTML结构 <form class="newsletter"> <input type="email" value="" placeholder="Enter yo

  • jquery validate和jquery form 插件组合实现验证表单后AJAX提交

    要实现表单验证和无刷新提交表单我们可以使用jQuery的两个很好用的插件--jquery validate.js 和 jquery form.js.具体详细说明情况下文. 1.jQuery validate.js,它说白了就是一个很高尚的人为我们写好了各种表单的验证,不用我们这些童鞋去现写了,一天天的多累啊,呵呵. 2.jQuery form.js,"这个插件能够让你简洁的将以HTML形式提交的表单升级成采用AJAX技术提交的表单. 插件里面主要的方法, ajaxForm 和 ajaxSubmi

  • jQuery基于ajax()使用serialize()提交form数据的方法

    本文实例讲述了jQuery基于ajax()使用serialize()提交form数据的方法.分享给大家供大家参考,具体如下: jQuery的serialize()方法通过序列化表单值,创建URL编码文本字符串,我们就可以选择一个或多个表单元素,也可以直接选择form将其序列化,如: <form action=""> First name: <input type="text" name="FirstName" value=&qu

  • jQuery同步提交示例代码

    本文实例讲述了jQuery同步提交的方法.分享给大家供大家参考,具体如下: 使用jQuery 框架,同步提交演示 在一些严格检测或者递归.循环调用的情况下,如果不能同步返回数据则可能会出现错误结果,所以需要使用同步提交技术,jQuery默认是异步操作,需要显式设置异步属性async为false,便可以实现同步. 自定 data 提交 function GroupCheck(url, operate, check, group, joker) { var result = -1; $.ajax(

  • jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.o

  • jquery ajax 如何向jsp提交表单数据

    jquery ajax 如何向jsp提交表单数据

    AJAX越来越火了,作为一个WEB程序开发者要是不会这个感觉就要落伍,甚至有可能在求职的时候屡被淘汰.我也是一个WEB程序开发者,当然我也要 "随波逐流"一把,不然饭碗不保啊! 之前实现AJAX使用Javascript脚本一个一个敲出来的,很繁琐.学习Jquery之后就感觉实现AJAX并不是那么的困难了,当然除了 Jquery框架外还有其它的优秀框架这里我就着重说下比较流行的Jquery.Jquery AJAX提交表单有两种方式,一是url参数提交数据,二是form提交(和平常一样在后

  • jQuery使用$.ajax提交表单完整实例

    本文实例讲述了jQuery使用$.ajax提交表单的方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/199

  • Jquery中ajax提交表单几种方法(get、post两种方法)

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的方法.$get方式提交表单get() 方法通过远程HTTP ,下面我来介绍两个提交表单数据的方法. $get方式提交表单 get() 方法通过远程 HTTP GET 请求载入信息 格式 $(selector).get(url,data,success(response,status,xhr),dataType

随机推荐