使用JQuery库提供的扩展功能实现自定义方法

网络编程 2024/11/6 佚名

3 1 2

JQuery包装器提供了大量的方法，可以再页面中直接使用。但是，没有任何一个库可以满足所有的需求，所以，JQuery库提供了丰富的扩展功能。以禁用一组表单元素为例，看看怎么简单有效的在JQuery库中添加自定义的功能扩展。（JQuery没有禁用表单元素的方法哦）

上代码：

<!DOCTYPE> 

<html lang="en"> 

<head> 

<title>Custom Method!</title> 

<meta http-equiv="content-type" content="text/html;charset=utf-8"> 

<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-2.1.1.js">

文本框和按钮已经被禁用：


若只禁用按钮，添加一个css类即可;


jQuery(function() 
{
$("form input.test").disable(); 
});


看看是不是禁用了按钮：

实现也很简单，打开jquery-2.1.1.js源码，没有压缩的，比较容易，我引入
的是jquery-2.1.1.js，然后添加下列代码


jQuery.fn.disable=function () { 

return this.each(function() 

{ 

if(this.disabled != null) this.disabled=true; 

}); 

}


在按照上述案例的方式调用即可。
在《JQuery In Action》一书中，提到以$.fn.方法名方式扩展（P12），我测试过，没有实现禁用。错误之处，还望指正。