JQUERY - 技术教程文章

jquery 快速入门学习总结【代码】

jquery 快速入门学习总结jquery简介 jquery 是一个免费,开源的javascript 库.jquery作用 方便完成web前端的工作,例如节点操作,元素操作,事件绑定,ajax操作,并且解决了大部分的兼容问题jquery使用配置 1.本地配置 1.1 下载jquery文件, www.jquery.com 1.2 引入,放在文件同目录 <script type="text/javascript" src="jquery.1.8.3.min.js"></script> 2.远程访问文件 <script src="http://www.xiaohigh.com/...

jquery插件集

自定义滚动条jquery-custom-scrollbar放大镜 fancybox,lightbox,jquery zoom原文:http://www.cnblogs.com/toward-the-sun/p/5583350.html

jquery form submit提交方式

https://www.cnblogs.com/weimingxin/p/6823321.htmlhttps://www.cnblogs.com/weimingxin/p/6823321.html原文:https://www.cnblogs.com/xyyou/p/12384649.html

jQuery中bind,live,delegate与one方法的用法及区别解析

bind( )方法用于将一个处理程序附加到每个匹配元素的事件上并返回jQuery对象。.bind(eventType[, evnetData], Handler(eventObject)) 其中,参数eventType是一个字符串,包含一个或多个javaScript事件类型,例如click,submit或自定义事件的名称,指定多个事件类型时用空格分隔各个类型;eventData为Map类型,给出要传递给事件处理程序的数据,handler指定触发该事件时要执行的函数,eventObject表示事件对象。 .bind()方...

JQuery选择所有标题的元素【代码】

$(":header")参考:http://www.w3school.com.cn/jquery/selector_header.asp原文:http://www.cnblogs.com/EasonJim/p/6286502.html

jQuery源码1

jQuery源码(2.0.3)体系结构:(function(){ (21 ,94):定义一些变量和函数:jQuery=function(){} (96 ,283):个jQuery对象,添加一些方法和属性,(285 ,347):extend:jQuery的继承方法 (349 ,817):jQuery.extend():扩展一些工具(静态)方法 (877 ,2856):Sizzle:复杂选择器的实现 (2880,3042):Callbacks:回调对象:对函数的管理 (3043, 3183):Deferred:延迟对象:对异步的管理 (3...

23.jquery隐藏和显示【代码】

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>jquery的显示和隐藏</title> <style type="text/css">div{width:150px;height:100px;border:1px red solid;display:none; } </styl...

jquery插件anccordion【代码】

1 (function(){2 $.fn.YAccordion=function(options){3 4var settings={5 trigger:‘click‘,6 speed:300,7 };8 9if(options) 10 $.extend(settings,options); 1112returnthis.each(function(){ 13 $("p",this).bind(settings.trigger,function(){ 14 $(this).next("ul").slideToggle(settings.speed).siblings("ul").hide(); 15 }); 16 ...

解决vue与传统jquery插件冲突

比如基于jquery的select2插件,在vue下单独用有很多问题,其实对于这类插件,可以用vue的自定义指令和组件来包装,解决冲突的问题。引用官方vue1.0和2.0的两个例子,学习一下。例子1.0 例子2.0原文:http://www.cnblogs.com/zhansu/p/6112837.html

[jQueryUI] - Chosen:select下拉选择框美化插件及问题【转】【图】

hosen 是一个支持jquery的select下拉框美化插件,它能让丑陋的、很长的select选择框变的更好看、更方便。不仅如此,它更扩展了select,增加了自动筛选的功能。它可对列表进行分组,同时也可禁用某些选择项。先来看下插件的效果: 跟这个比起来,原来的select样式是不是弱爆了!马上来武装我们的select吧:1、先把js和css文件引用到网页里面去:?123<link href="js/jqueryUI/chosen/chosen.css" type="text/css" rel="stylesheet" /...

jQuery.extend()【代码】【图】

使用jquery的$.extend()之前突然想到如何查看jquery的版本$.fn.jquery转入正题,在没有研究jquery源码之前,都不知道这个方法的使用,接触过后感觉这东西还可以,在此做个notejQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象。注意:1. 如果只为$.extend()指定了一个参数,则意味着参数target被省略。此时,target就是jQuery对象本身。通过这种方式,我们可以为全局对象jQuery添加新的函数。2. 如果多个对象具有相同...

Jquery实现复选框只能单选【代码】

<html> <head> <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> </head> <body> <div id="divckb"> <input type="checkbox" name="ckb1" value="1" />张三 <input type="checkbox" name="ckb2" value="2" />李四 <input type="checkbox" name="ckb3" value="3"/>王五 <input type="checkbox" name="ckb4" value="4" />赵六 </div> <script> $(function(){$("#divckb input").each(function(){$(this).change...

音频视频播放(jquery中将jquery方法转化成js方法)【代码】

在jQuery中没有音频视频直接播放的方法,我们在写音频视频时,应该将jquery的方法转化为js方法:play();pause()补充: 将jq对象转化成js对象写法:var music=$("#music")[0];//将jq转化为js对象;将js对象转化成jq对象:这个对象已经存在,则只需要在此对象上加上$(),也即是$(对象) 1 <!DOCTYPE html>2 <html lang="en">3 <head>4 <meta charset="UTF-8">5 <title>Title</title>6 <script src="js/jquery-3.1.0...

jQuery 源码分析笔记

jQuery的宗旨是Write Less, Do More。它对JavaScript的开发风格侵入性不如YUI那么强,当然也不如Dojo和YUI如此庞大。它极大的简化了JavaScript的日常开发工作,主要是DOM元素的操作(从名字Query就可以看出)。另外一个主要工作就是每个前端开发者都需要面对的浏览器兼容性。jQuery兼容所有主流浏览器的大部分版本,从万恶的IE6开始直到Firefox,Chrome等现代浏览器。除了居于核心的一小部分代码之外,剩下的jQuery都是松散的函数,...

jQuery控制文本的大小写。【代码】

在上一篇随笔中小颖分享了用CSS的text-transform 属性控制文本的大小写,今天小颖再给大家分享一段用jQuery实现控制文本的大小写,由于小颖已经好久没写过jQuery了,如果有什么不对的地方希望大家告诉小颖哦,小颖加以改正,好啦废话不多说啦,下面大家请看小颖写的代码: ~~~~~当当当当html代码:<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><script type="text/javascript" src="...

jquery and jquery validation 错误解决记录【代码】

Cannot read property ‘settings‘ of undefined jquery validation这个问题常常发生在动态添加rule的时候。 解决方法// 在timeout 方法中加入规则。 setTimeout(function() {$(‘#my_field‘).rules(‘add‘, { required: true }) }, 0); 原文:http://www.cnblogs.com/yudar/p/5754677.html

使用ajax获取JSON数据的jQuery代码的格式【图】

具体的也可以参考:http://www.w3cfuns.com/notes/16039/2b004b1bcdf79092f2e66b2bbe9f51df.html原文:http://www.cnblogs.com/ncuhwxiong/p/5913871.html

网站前端_Jquery-基础入门.0001.原生Js到后期封装库Jquery的过渡?【代码】

原生缺点:1. JS的出现使得网页与用户之间实现了一种实时/动态/交互的关系,网页可以包含更多活跃的元素和精彩的内容2. JS的弊端在于复杂的DOM对象,而JQuery封装了很多预定义的对象和使用函数简化了DOM操作,使得我们可以快速创建有高难度交互的富客户端页面,且兼容各大浏览器简单介绍:1. JQuery是一个优秀的JavaScript库,拥有强大的选择器,出色的DOM操作,可靠的事件处理,完善的兼容性和链式操作等功能,目前团队主要推核心库(JQuery)/...

jquery 滚动条插件 可以自定义【代码】

以后用起来就方便了把css文件引入<link rel="stylesheet" type="text/css" href="css/jquery.mCustomScrollbar.css"> js引入<script type="text/javascript" src="js/jquery.mCustomScrollbar.concat.min.js"></script> <div class="mscroll"> 这里放内容啊啊啊啊这里放内容啊啊啊啊这里放内容啊啊啊啊这里放内容啊啊啊啊。。。。。 </div> <script type="text/javascript"> $(function(){$(".mscroll").mCustomScrollbar({scrollI...

使用jQuery Mobile实现新闻浏览器(3)【图】

在本教程的前两篇文章中,笔者分别向大家介绍了使用jQuery Mobile框架如何去设计手机新闻浏览器,其中实现了一个WEB版本的新闻浏览器,在本教程的最后一篇中,将讲解如何将已实现的web版本的新闻浏览器迁移到Android手机中去,注意的是,本文希望读者拥有一点基础的Android知识。迁移到Android应用中去  在Android应用中,将会使用index.html作为界面的布局,我们将编写一个Android的Activity类将index.html整合到android应用中去...

jQuery 包装集【代码】【图】

一、创建元素1、jQuery内部使用document.createElement创建元素实例://jQuery 源代码方法一: $("<div></div>").css({‘width‘: ‘100px‘,‘height‘: ‘50px‘,‘padding‘: ‘10px‘,‘border‘: ‘3px solid red‘ }).html(‘我是jQuery动态创建的div‘).appendTo(‘body‘);方法二: $("<div style=‘width: 100px;height: 50px;padding: 10px;border: 3px solid red;‘></div>").text(‘我是jQuery动态创建的div‘).append...

基于Jquery ajax技术实现间隔N秒向某页面传值【代码】

有时候我们需要每隔一段时间向某页面传值,比如说聊天室,每隔几秒就像数据库处理页面传值并取回,然后显示在聊天窗口。又或者是每隔一段时间就查询用户最后发言时间到现在是否间隔2分钟,如果是则将用户退出。这个时候我们就要用到HTML DOM setInterval() 方法。setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInt...

JQuery和javascript优秀插件收集

JQuery插件库: http://plugins.jquery.com/有趣的时钟: http://ynif.v099.10000net.cn/demo/shijian/3/shijian/index.html别人收集信息8个实用的页面布局和用户界面jQuery插件http://blog.ui90.com/eight-practical-jquery-plugin-page-layout-and-user-interface.html15款最好的 jQuery 网格布局插件(Grid Plugins) http://www.cnblogs.com/lhb25/p/15-jquery-grid-plugins.html2013年优秀jQuery插件 http://www.cnblogs.com/fe...

jQuery.lazyload使用及源码分析【代码】

前言:貌似以前自己也写过图片懒加载插件,但是新公司使用的是jQuery.lazyload插件,为了更好的运用,自己还是把源码看了遍,分别记录了如何使用,插件原理,各个配置属性的完整解释,demo实例,源码分析(较简短),源码分析可以配合使用,配置属性,原理进行阅读,如需转载,请注明出处博客园 华子yjh 一、如何使用// 最简单的使用,不带参数 $(‘img‘).lazyload();// 带参数(配置对象),下面配置对象中的各个属性值都是默认的 $(...

jQuery动画知识总结【代码】

jQuery动画概述我们之前实现的下拉菜单的案例,是没有动画效果的,但是在日常开发中,动画效果是经常会用到的,所以我们可以尝试使用jQuery动画,将下拉菜单案例实现的更动感一些。jQuery提供了三组动画,这些动画都是标准的、有规律的效果,同时jQuery还提供了自定义动画的功能。显示与隐藏显示(show)与隐藏(hide)是一组动画:show方法详解show([speed], [callback]); /* speed(可选):动画的执行时间1.如果不传,就没有动画效果。...

jquery 显示“加载状态 结束”【代码】

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ TR/xhtml1/DTD/xhtml1-transitional.dtd">2 <html xmlns="http://www.w3.org/1999/xhtml">3 <head runat="server">4 <title></title>5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />6 <style>7 * { margin:0; padding:0;}8 body { font-size:12px;}9#loading{ 10 width:80px; 11 height: 20px; 12 b...

jquery.cookie.js的使用

jquery.cookie.js是一个基于jquery的插件所以要加上两条引用: 使用前要先导入jquery.js <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 然后再导入jquery.cookie.js,可以使用google和百度搜索下再下载 <script type="text/javascript" src="http://yxb.qq.com/js/jquery.cookie.js"></script> $.cookie(‘the_cookie‘); // 获得cookie$.cookie(‘the_cookie...

JQuery需要手动回收xmlHttpRequest对象

今天在园子里面看到kuibono的文章说JQuery不会自动回收xmlHttpRequest对象,并且在每次Ajax请求之后都会创建一个新的xmlHttpRequest对象,感到惊讶,索性写了一个程序验正了一下,果然如kuibono所言,之前一直都不曾注意到这一点,今天幸亏看了kuibono的文章,下面是kuibono给出的手动回收xmlHttpRequest对象的代码片断:$.ajax({ url: "http://www.aizr.net", data: { name: "xxxx" }, dataType: "xml", success: fun...

jQuery的html方法在IE9上的奇葩事【图】

先看代码,不然说不清这奇葩事情!!以上代码现在效果没有问题了。 在没有修复代码之前,代码是没有(2)而且(1)也没有注释。它的现象是在firefox下运行正常,在IE9下代码运行不正常,如果在IE9上进行调试,代码是可以执行到(1)处的,显示也正常了。=======把代码修复成这样后,在IE9模式下就显示正常了。我想请问给一个<span id="sendFlag"></span>赋值在if条件前和条件后有什么区别吗?文章发表后,我发现新的可以正常运行的...

jquery validate 验证不通过后验证正确的信息仍残留在label上的解决方法【代码】【图】

在使用validate进行表单验证时会有第一次验证通过,但是第二次验证不通过时,第一次验证通过的信息残留在label上面的情况,最常见的就是√残留如此图所示:此时“请输入姓名”前面应该时×才是正常情况。如何解决这个问题?需要对jquery.validate.js文件进行修改,原因如下:一次验证成功但是二次验证失败后,会进入如下代码: showLabel: function( element, message ) {var place, group, errorID,error = this.errorsFor(...