使用requirejs插件来加载jquery.idcode插件的方法和在线实例演示原创

文章标签: RequireJS实例

---

• :
• 01-04 00:00
• :
• 42次
• :
• 0条
• 1赞
• 点赞

简介本文非常详细的给你介绍用requirejs插件来加载第三方的jquery.idcode验证码插件的具体方法步骤和在线实例演示。

站长现在非常的习惯使用requirejs来加载网页里所需要用的第三方插件或js文件，因为requirejs使用起来真的是太方便了。

本文站长来给大家说下如何使用requirejs插件来加载jquery.idcode这个验证码插件，下面是站长准备的在线实例演示：

使用requirejs来加载jquery.idcode验证码插件的在线实例演示

下面站长一步一步的教你如何来做：

第一步：网页里引入requirejs源文件：

<script language="JavaScript" src="//cdn.bootcss.com/require.js/2.3.5/require.min.js"></script>

第二步：配置require.config：

require.config({	
    paths: {		
        "jquery": "//apps.bdimg.com/libs/jquery/1.9.1/jquery.min",		
        "css": "//cdn.bootcss.com/require-css/0.1.10/css.min",		
        "jquery.idcode": "/html/aijquery/jquery.idcode"	
    },	
    shim: {		
        "jquery.idcode": {			
            deps: ["css!/html/aijquery/jquery.idcode","jquery"]		
        }	
    }
});

PS:我们把jquery.idcode插件对应的css样式文件配置在了shim里，这样我们在引用的时候就会同步加载上面我们配置的css样式文件了，如果你对require里加载css样式文件有问题，可以看这篇文章：require-css的使用方法及实例

第三步：编写我们所需的js代码：

require(["jquery","jquery.idcode"], function($) {
    $.idcode.setCode({
        e: "yzm",
	codeType: {
	    name: "follow",
	    len: 4
	},
	codeTip: "换验证码",
	inputID: "aijquery_yzm"
    });	
    $("#aijquery").click(function() {
        var IsBy = $.idcode.validateCode();		
        alert(IsBy);	
    });
});

好了，到这里就完成了，当然不要忘了布置相应的HTML代码：

<label class="lblVerification">验证码</label>
<input type="text" id="aijquery_yzm" />
<span id="yzm"></span><br>
<button type="button" id="aijquery">验证</button><br>

---

---

您正在找的文章可能是：