jQuery中实现自定义方法的扩展
JQuery包装器提供了大量的方法,可以再页面中直接使用。但是,没有
任何一个库可以满足所有的需求,所以,JQuery库提供了丰富的扩展功能
。以禁用一组表单元素为例,看看怎么简单有效的在JQuery库中添加自定
义的功能扩展。(JQuery没有禁用表单元素的方法哦)
上代码:
1: <!DOCTYPE> 2: <html lang="en"> 3: <head> 4: <title>Custom Method!</title> 5: <meta http-equiv="content-type" content="text/html;charset=utf-8"> 6: <script type="text/javascript" src="js/jquery-2.1.1.js"></script> 7: <script type="text/javascript"> 8: jQuery(function() 9: { 10: $("form input").disable(); 11: }); 12: </script> 13: </head> 14: <body> 15: <p>测试自定义方法禁用表单元素</p> 16: <form> 17: <input type="text" value="test"><br/> 18: <input type="button" value="confirm" class="test"> 19: </form> 20: </body> 21: </html>
文本框和按钮已经被禁用:
若只禁用按钮,添加一个css类即可;
1: jQuery(function() 2: { 3: $("form input.test").disable(); 4: });
看看是不是禁用了按钮:
实现也很简单,打开jquery-2.1.1.js源码,没有压缩的,比较容易,我引入
的是jquery-2.1.1.js,然后添加下列代码
1: jQuery.fn.disable=function () { 2: return this.each(function() 3: { 4: if(this.disabled != null) this.disabled=true; 5: }); 6: }
在按照上述案例的方式调用即可。
在《JQuery In Action》一书中,提到以$.fn.方法名方式扩展(P12),我
测试过,没有实现禁用。错误之处,还望指正。
更多相关文章,去看看
jQuery中实现自定义方法的扩展的更多相关文章
- JavaScript jQuery 事件、动画、扩展
事件 因为JavaScript在浏览器中以单线程模式运行,页面加载后,一旦页面上所有的JavaScript代码被执行完后,就只能依赖触发事件来执行JavaScript代码. 浏览器在接收到用户的鼠标或 ...
- jQuery中的事件——《锋利的JQuery》
虽然利用原生的JavaScript事件能完成一些交互,但jQuery增加并扩展了基本的事件处理机制.jQuery不仅提供了更加优雅的事件处理语法,而且极大地增强了事件处理能力. 1.加载DOM 在Ja ...
- JQuery中的工具函数总结
前提引入 前提当然也是要引入Jquery啦... <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" typ ...
- jQuery中的100个技巧
1.当document文档就绪时执行JavaScript代码. 我们为什么使用jQuery库呢?原因之一就在于我们可以使jQuery代码在各种不同的浏览器和存在bug的浏览器上完美运行. < ...
- jQuery:详解jQuery中的事件(一)
之前用过一些jQuery的动画和特效,但是用到的部分也不超过10%的样子,感觉好浪费啊——当然浪费的不是jQuery,而是Web资源.后来就想深入研究下jQuery的内部机理,读过两遍jQuery源代 ...
- jQuery学习笔记(四)jQuery中的动画
目录 show()方法和hide()方法 fideIn()方法和fadeOut()方法 slideUp方法和slideDown()方法 自定义动画方法animate toogle(),slideTog ...
- jquery中的DOM事件绑定与解绑
在jquery事件中有时候有的事件只需要在绑定后有效触发一次,当通过e.target判断触发条件有效触发后解除绑定事件,来避免多次无效触发和与未知情况造成冲突. 这时候就要用到了jquery中的事件绑 ...
- jQuery中$.fn的用法示例介绍
$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效,下面有个不错的示例,喜欢的朋友可以参考下 如扩展$.fn.abc(),即$.fn.abc()是对jquery ...
- 深入jQuery中的data()
引入 data函数在jQuery中看起来很不起眼, 就像沙滩上一颗平凡的沙子, 但仔细一瞅, 却惊讶的发现data是jQuery中无比重要的一环, 甚至jQuery中各种事件都基于此. data有什么 ...
随机推荐
- SCRUM,一个采用迭代,增量方法来优化可预见控制风险
Scrum是一个用于开发和维持复杂产品的框架,是一个增量的,迭代的开发过程.在这个框架中,整个开发过程是由若干个短的迭代周期组成,一个短的迭代周期称为一个Sprint,每个Sprint的建议长度是2到 ...
- Does not contain a valid host:port authority: Master:8031 (configuration property 'yarn.resourcemanager.resource-tracker.address')
问题解决: 这个错误是:yarn里面的配置的格式有错误:如: <property> <name>yarn.resourcemanager.address</name> ...
- DeepID人脸识别算法之三代(转)
DeepID人脸识别算法之三代 转载请注明:http://blog.csdn.net/stdcoutzyx/article/details/42091205 DeepID,目前最强人脸识别算法,已经三 ...
- Scrum中的User Story
我们通常用User Story来描述Backlog里的各个Backlog项,User Story是从用户的角度对系统的某个功能模块所作的简短描述.一个User Story描述了项目中的一个小功能,以及 ...
- mac忘记密码的解决办法
开机, 启动时按"cmd+S".这时,你会进入Single User Model,出现像DOS一样的提示符 #root>.请在#root>下 输入 (注意空格, 大小写 ...
- Samza的ApplicationMaster
当Samza ApplicationMaster启动时,它做以下的事情: 通过STREAMING_CONFIG环境变量从YARN获取配置信息(configuration) 在随机端口上 启动一个JMX ...
- php的redis 操作类,适用于单台或多台、多组redis服务器操作
redis 操作类,包括单台或多台.多组redis服务器操作,适用于业务复杂.高性能要求的 php web 应用. redis.php: <?php /* redis 操作类,适用于单台或多台. ...
- Google-Gson使用
转自:http://my.oschina.net/itblog/blog/204120 这几天,因为项目的需要,接触了Google的Gson库,发现这个东西很好用,遂记下简单的笔记,供以后参考.至于G ...
- Jdk5.0中出现的新特性
掌握jdk5.0中出现的新特性1.泛型(Generics)2.增强的"for"循环(Enhanced For loop)3.自动装箱/自动拆箱(Autoboxing/unboxin ...
- !! Scrum之 流程和术语
!!Scrum之 流程和术语 http://www.cnblogs.com/zhoujg/archive/2009/07/15/1523680.html 以下将对一些术语进行简单介绍,以便大家现在开始 ...