本文实例讲述了jQuery实现简易的输入框字数计数功能。分享给大家供大家参考，具体如下： 运行效果图如下：具体代码如下： <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title></title><script src="jquery-1.7.2.min.js"></script> </head> <body> <div class="container"><input id="abc" value="脚本之家"><span id="wordCountShow"></span> </div> <script>$.fn.extend({wordCount: function (maxLength, wo...
本文实例讲述了jQuery实现的省市联动菜单功能。分享给大家供大家参考，具体如下： 主要通过 select 下的 option 的 change 事件动态的为市级菜单添加数据。 index.html： <!DOCTYPE html> <html> <head><title></title><meta charset="utf-8"><script type="text/javascript" language="javascript" src="js/jquery-1.10.2.js"></script><script type="text/javascript" language="javascript" src="js/linkageProvinceCity.js"></...
本文实例讲述了jQuery动态生成表格及右键菜单功能。分享给大家供大家参考，具体如下： 这里用的是 jquery 1.4.1 的库文件，具体代码如下： <!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/1999/xhtml"> <head><title>无标题页</title><script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script><scri...
本文实例讲述了jQuery实现的简单排序功能。分享给大家供大家参考，具体如下： 这里演示的冒泡排序， 通过不断的循环找出最小的值，放到新的数组中。每次循环后都将指针指向下一个元素。直到两层循环都结束。 index.html： <html> <head><title>Sort</title><meta content="text/html" charset="utf-8"><script type="text/javascript" language="javascript" src="js/jquery-1.10.2.js"></script><script type="text/javascript" l...
本文实例讲述了JQuery异步提交表单与文件上传功能。分享给大家供大家参考，具体如下： Jquery.form.js是一个可以异步提交表单及上传文件的插件。 示例如下： index.html <!DOCTYPE html> <html> <head><title></title><meta charset="utf-8"><script type="text/javascript" language="javascript" src="js/jquery-1.10.2.js"></script><script type="text/javascript" language="javascript" src="js/jquery.form.js"></script><s...
在没给大家分享实现代码之前，先给大家展示下效果图：具体实现代码如下所示： index.html <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>iNettuts - Welcome!</title><link href="inettuts.css" rel="stylesheet" type="text/css" /> </head> <body><div id="head"><h1>iNettuts</h1></div><div id="columns"><ul id="column1" class="column"><li class="widget co...
本文实例讲述了jQuery实现倒计时重新发送短信验证码功能的方法。分享给大家供大家参考，具体如下： <!DOCTYPE html> <html> <head> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> var countdown=60; function settime(obj) {if (countdown == 0) {obj.removeAttribute("disabled");obj.value="免费获取验证码";countdown = 60;return;} else {obj.setAttribute("di...
废话不多说了，直接给大家贴代码了，具体代码如下所示： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>jQuery实现CheckBox全选、全不选</title> <script src="http://code.jquery.com/jquery-2.2.3.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { $(:checkbox).click(function(evt){ // 阻止冒泡 evt.stopPropagation(); }); //判断是否全选 $("#checkAll"...
Jquery多选框的基本操作：支持全选、反选、取消全选的功能HTML正文： <input type="checkbox" id="c1">全选/全不选<br> 兴趣爱好：<br> <input type="checkbox" name="interst" value="basketball">篮球 <input type="checkbox" name="interst" value="football">足球 <input type="checkbox" name="interst" value="bedminton">羽毛球<br> <input type="button" id="b1" value="全选"> <input type="button" id="b2" value="全不选...
jquery仿淘宝搜索下拉列表实现效果如下：网上搜索教程：<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>jQuery UI Autocomplete - Default functionality</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"...
Jquery实现表格元素的动态创建，本质是通过构造一个Dom Node节点，并且拼接到表格的Dom树上的子叶位置。HTML正文： 用户：<input type="text" id="user"/> 邮箱：<input type="text" id="mail"/> 手机：<input type="text" id="phone"/> <br> <button id="b1">添加</button><br> <table border=1 id="table"> <tr><td>user</td><td>mail</td><td>phone</td><td>operation</td></tr> <tr><td>zhangsan</td><td>aaa@qq.com</td><td>2...
二维码：利用图形模拟二进制0、1的概念，达到存储少量数据的功能，一般移动端浏览器解析出二维码里面隐藏的url数据会自动进行跳转，常见的支付宝、微信扫描登陆就是利用该原理 Jquery二维码的实现：jquery.qrcode.min.js插件HTML正文： <script type="text/javascript" src="js/jquery.qrcode.min.js"></script><input type="button" value="二维码" id="bt" />： <span id="count"></span> <br> <div id="code"></div> <br>Javasc...
废话不多说了，下面给大家介绍下jquery easyui 验证功能的实例代码。 { field : startPort, title : "起始端口", editor: "text", width : 50, editor: { type: SuperValidatebox, options: { required: true, validType: [integer,length[0,5]] } }, 自从1.3.2版本开始，validatebox自身已经支持多重校验了，例如： input class="easyui-validatebox" data-options="required:tru...
jQuery的ajax方法非常好用，这么好的东西，你想拥有一个属于自己的ajax么？接下来，我们来自己做一个简单的ajax吧。 实现功能 由于jq中的ajax方法是用了内置的deferred模块，是Promise模式的一种实现，而我们这里没有讲过，所以我们就不使用这一模式啦。 我们只定义一个ajax方法，他可以简单的get，post，jsonp请求就可以啦~~ var ajax = function () {// 做一些初始化，定义一些私有函数等return function () {// ajax主体代码} }...
实现这个其实蛮简单的，转动的效果用的jqueryRotate插件，所以只要判断每个奖荐对应的角度，然后设置指针的转动角度就可以了。比如关键的是jqueryRotate这个插件的用法。 jqueryRotate的资料： 支持Internet Explorer 6.0+ 、Firefox 2.0 、Safari 3 、Opera 9 、Google Chrome，高级浏览器下使用Transform，低版本ie使用VML实现 google code地址：http://code.google.com/p/jqueryrotate/ 调用和方法： $(el).rotate({ angle:0,...