JQUERY - 技术教程文章
jQuery 增加 删除 修改select option
jQuery获取Select选择的Text和Value: 1. var checkText=jQuery("#select_id").find("option:selected").text(); //获取Select选择的Text 2. var checkValue=jquery("#select_id").val(); //获取Select选择的option Value 3. var checkIndex=jQuery("#select_id ").get(0).selectedIndex; //获取Select选择的索引值 4. var maxIndex=jQuery("#select_id option:last").attr("index"); //获取Select最大...
jQuery的内容选择器【代码】
JQuery中的内容选择器JQuery中的内容选择器有四个：:contains(text) 匹配包含给定文本的元素 :empty 匹配所有不包含子元素或者文本的空元素 :has(selector) 匹配含有选择器所匹配的元素的元素 :parent 匹配含有子元素或者文本的元素具体例子如下： <div></div><div><span></span></div><div>我是一个div</div><div><p></p></div><div>我是一个div123</div><div><span><p></p></span></div>我们的JS代码如下：$("div:empty"...
提高jQuery性能的十个诀窍【图】
转自： http://www.jb51.net/article/43198.htm1. 使用最新版本的jQueryjQuery的版本更新很快，你应该总是使用最新的版本。因为新版本会改进性能，还有很多新功能。下面就来看看，不同版本的jQuery性能差异有多大。这里是三条最常见的jQuery选择语句：$(‘.elem‘)$(‘.elem‘, context)context.find(‘.elem‘)我们用1.4.2、1.4.4、1.6.2三个版本的jQuery测试，看看浏览器在1秒内能够执行多少次。结果如下：可以看到，1.6.2版本的...
jquery miniui 学习笔记
1.取组件值 传递form data，load发送 请求加载数据 <script type="text/JavaScript"> mini.parse(); // get grid var grid = mini.get("grid"); var form = new mini.Form("#form"); function search() { //取得某个id组件的 value var rq = mini.get("yf").getValue(); if (rq ) { // 将form 里的参数和值传给 grid发送的请求 grid.load(form.getData(true)); } else { mini.alert("请选择"); } } </scrip...
【JQuery NoviceToNinja系列】01 开篇 Html页面设计和布局【代码】【图】
01 开篇 Html页面设计和布局 index.html<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>StarTrackr !</title><link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon"/><meta name="viewport" content="width=device-width"/><link rel="stylesheet" href="./css/base.css"/><!--<link rel="stylesheet" href="../.....
jquery实时获取时间
$(document).ready(function(){ function time(){ var date=new Date(); var h=date.getHours(); var m=date.getMinutes(); var s=date.getSeconds(); $(‘div‘).eq(0).html(h); $(‘div‘).eq(1).html(m); $(‘div‘).eq(2).html(s); for(var i=0;i<$(‘div‘).length;i++){ if($(‘div‘).eq(i).text().length==1){ $(‘div‘).eq(i).html(function(index,html){ return 0+html; }); } } } time(); setI...
jQuery中filter(),not(),split()的用法
filter(),not(): 程序代码<script type="text/javascript">$(document).ready(function() {//输出 helloalert($("p").filter(".selected").html());//输出 How are you?alert($("p").not(".selected").html());});</script> </head><body> <p class="selected">Hello</p><p>How are you?</p><!--一个新的挑战是从一组类似或相同的元素中只选择某一个特定的元素。jQuery提供了filter()和not()来做这个。filter()能够将元素精简...
jQuery页面刷新(局部、全部)问题分析
本文实例分两部分对jquery刷新问题进行介绍，第一部分介绍了呢页面局部刷新；第二部分介绍了页面全部刷新第一：页面局部刷新jQuery对Ajax操作进行了封装，在jQuery中$.ajax()方法属于最底层的方法，第2层是laod()、$.get()和$.post()方法，第3层是$.getScript()和$.getJSON()方法。重点分析load()方法通常用来从Web服务器上获取静态的数据文件.要传递一些参数给服务器中的页面，那么可以使用$.get()或者$.post()方法$.ajax方法load...
jquery 文本/html/值【代码】
<!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>文本/html/值</title><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/><style type="text/css"></style><script type="text/javascript" src="jquery-1.7.1.min.js"></script><script type="text/javascript">/*html(...
jQuery选择器和事件【代码】
一、jQuery选择器 <!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script src="jquery-1.10.1.min.js"></script><script src="Selector.js"></script></head><body><p>p1</p><p class="pclass">p2</p><button>Click me</button></body> </html>$(document).ready(function(){$("button").click(function(){$(".pclass").text("p元素被修改了");}) });二、jQuery事件 1.jQuery事件： 常用事件方法...
自编基于jQuery实现分页插件【代码】
$(function(){// $.page({ // dataUrl:‘userLive!dataList.action‘, // countUrl:‘userLive!dataCount.action‘, //暂时无用到 // data:{liveName:""}, // currentPage:1, // pageSize:5, // pageShowDivId:‘pageShow‘, // contentMark:‘条记录‘, // pageSkin:‘#46c1de‘, // styleType:1 // }); }); /*** @params dataUrl：请求数据url地址...
jQuery基础知识--选择器与效果
$(this).hide()-----隐藏当前元素 $("p").hide()------隐藏所有段落 $(".test").hide()--隐藏所有class="test"的元素 $("#test").hide()--隐藏所有id="test"的元素文档就绪函数 $(document).ready(function() { ---------jQuery function go here------------ })jQuery选择器 选择器允许对元素组或单个元素进行操作。学习jQuery选择器的关键是学习jQuery选择器如何准确地选取你希望应用效果的元素 ...
二、jQuery中的DOM操作【代码】
Dom操作的分类一般来说，Dom操作分为3个方面，即DOM Core、HTML-DOM和CSS-DOM。jQuery中的DOM操作一、查找节点用jQuery在文档树上查找节点非常容易，可以利用前面介绍的jQuery选择器来完成。1、查找元素节点 利用jQuery选择器<script type="text/javascript"> $(function(){ //获取第二个li元素 var $li=$(‘ul li:eq(1)‘); var li_txt=$li.text(); alert(li_txt); }); </script> <p title="选择你最喜...
使用HTML+CSS，jQuery编写的简易计算器【代码】
1<%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3<!DOCTYPE html> 4<html> 5<head> 6<meta charset=" utf-8"> 7<meta name="author" content="http://www.softwhy.com/"/> 8<title>简易计算器</title> 9<jsp:include page="inc/easyui.jsp"></jsp:include> 10<style type="text/css"> 11button { 12 font-size: 18px; 13 font-weight: bold; 14 width: 75px; 15...
如何书写高质量的jQuery代码
想必大家对于jQuery这个最流行的javascript类库都不陌生，而且只要是前端开发人员肯定或多或少的使用或者接触过，在今天的这篇文章中，我们将介绍一些书写高质量jQuery代码的原则，我们不单单会告诉你如何去书写，也会告诉你为什么这样书写，希望大家会觉得有所帮助，如果你也有自己的一些经验分享，请不吝赐教！注意定义jQuery变量的时候添加var关键字这个不仅仅是jQuery，所有javascript开发过程中，都需要注意，请一定不要定义成...
jQuery从0开始之【二】jQuery使用原则及常用事件
jQuery名称冲突问题：jQuery使用$符号作为jQuery的简介方式。但是某些JavaScript库中的函数（比如Prototype）同样使用$符号。jQuery使用名为noConflict()的方法来解决该问题。var jq=jQuery.noConflict()，帮助我们使用自己的名称（比如jq）来代替$符号。把所有的jQuery代码置于事件处理函数中把所有事件处理函数放置于文档就绪事件处理器中把jQuery代码置于单独的.js文件中如果存在名称冲突，则重命名jQuery库jQuery的使用原则能让...
jQuery学习之路（3）- 事件【代码】【图】
▓▓▓▓▓▓ 大致介绍jQuery增加了并扩展了基本的事件处理机制，不但提供了更加优雅的事件处理语法，而且极大地增强了事件处理能力 ▓▓▓▓▓▓ jQuery中的事件 ▓▓▓▓▓▓ 加载DOM 在jQuery中是用$(document).ready()方法来替代JavaScript中的window.onload方法的，但是他们也有一些不同点 1、执行时机 例如我们有一个有很多图片的网页 $(document).ready()方法是在这个网页的DOM树加载完就可以执...
jQuery中绑定事件的几种方法
以click事件为例，jQuery中绑定事件有三种方法： （1）target.click(function(){}); （2）target.bind("click",function(){}); （3）target.live("click",function(){});第一种方法很好理解，其实就和普通JS的用法差不多，只是少了一个on而已第二、三种方法都是绑定事件，但是二者又有很大的不同，下面着重讲解一下，因为这个如果用到Jquery的框架的话是用的挺多的，尤其要注意二者的区别。【bind和live的区别】 live方...
Jquery的toggle()方法
toggle()并不是仅仅能 显示/隐藏而已它的格式如下 toggle(fn1,fn2,fn3.....)也就是说，它的参数可以说不定数目的 若干个方法，然后每个方法按顺序轮番调用$(document).ready(function(){ $("button").toggle(function(){ $("p").wrap("<div></div>"); }, function(){ $("p").unwrap(); }});原文：http://www.cnblogs.com/tommy-huang/p/4070717.html
转：使用jquery获取url以及jquery获取url参数的方法
转：使用jquery获取url以及jquery获取url参数的方法使用jquery获取url以及jquery获取url参数的方法 原文：http://www.cnblogs.com/Eric-Ting/p/3940026.html
jQuery插件扩展方法【代码】
jQuery为扩展插件提拱了两个方法，分别是：jQuery.extend(object) —— 给jQuery对象添加方法。jQuery.fn.extend(object) —— 为扩展jQuery类本身.为类添加新的方法； fn表示什么呢？下面代码是jQuery源代码中定义的fn：jQuery.fn = jQuery.prototype = { init: function( selector, context ) {//…… }; 从上面代码我们不难看出 jQuery.fn = jQuery.prototype。对于prototype肯定不会陌生， javascript没有明确的类...
php课程---JavaScript与Jquery的区别【代码】
使用Jquery必须在页面内引入一个Jquery包<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title><script type="text/javascript" src="jquery-1.11.2.min.js"></script></head><body><div id="aa" b...
第五模块：WEB开发基础 第3章·BootStrap&JQuery开发【代码】【图】
01-JQuery介绍02-jQuery文件引入和加载的区别03-jQuery的基础选择器04-jQuery的层级选择器05-jQuery的基本过滤选择器06-jQuery的属性选择器07-jQuery的筛选选择器08-jQuery的对象和DOM对象的转换09-jQuery效果-显示和隐藏10-jQuery的效果-slide11-jQuery的效果-fade12-jQuery的效果-animate13-右下角弹出小广告14-jQuery的属性操作-attr和prop15-jQuery的属性操作-class和值操作16-操作input中的value值17-jQuery文档操作-插入节点...
jquery实现图片上传前本地预览【代码】
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="js/jquery1.8.3-min.js"></script></head><body><div style="width:500px;margin:0px auto;"><h2>图片上传预览演示</h2> <div><img id="ImgPr" width="120" height="120" /></div> <input type="file" id="up" /></div><script> /* *参数说明: Img:图片ID;Width:预览宽度;Height:预览高度;ImgType:支持文件类型...
jQuery获取Select选择的Text和 Value(转)
jQuery获取Select选择的Text和Value:语法解释：1. $("#select_id").change(function(){//code...}); //为Select添加事件，当选择其中一项时触发2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text3. var checkValue=$("#select_id").val(); //获取Select选择的Value4. var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值5. var maxIndex=$("#select_id...
jquery ui widgets-datepicker【代码】【图】
jquery ui的用法就不在此讲述，直接进入jquery ui的窗体小部件(widgets)——datepicker。相信很多像我这样子的菜鸟少年，如果同一个页面上有两个input文本输入框是用来输入日期的话，那么我都是直接给这两个input文本输入框一个id，然后使用这两个id来进行datepicker的初始化设置。一般情况下，我都是按照下面的代码写的，但是慢慢地发现，老是这样子写多麻烦呀！难道就不能只使用一个div来加载一个query ui的datepicker吗？然后两...
关于JQuery设置checkbox checked 的问题【代码】【图】
近日做一个关于JQuery表单验证，有一个比较奇葩的要求，即checkbox是为必填项，textbox不是必填的。而checkbox与textbox又是相关的，填写了textbox，则其上方的checkbox即相当于勾选。在使用中，用户很容易只注意到textbox，忽视checkbox，而不勾选，造成验证不通过。所以想通过程序，在验证之前先判断textbox是否有值，如果有值，则自动勾选checkbox，再进行验证。最初的代码如下：if ($("#ZYAreaBC").val() != null) {if ($("#ZY...
jQuery名称冲突
1、问题分析：jQuery使用$符号作为jQuery的简介方式。有些 JavaScript 库中的函数（比如 Prototype）同样使用 $ 符号。这时，存在名称冲突,所以需重命名jQuery库。2、解决方法：jQuery 使用名为 noConflict() 的方法。3、示例：var jq=jQuery.noConflict()；原文：http://www.cnblogs.com/happybread/p/6654860.html
全面认识jQuery.fn，菜鸟总结【图】
今天想做树形导航栏，查找了资料，找到了一个框架，比较小所以研究其中的代码，发现第一句话就把我难住了，主角是——jQuery.fn。 在此，再次停住，只好继续找资料，现在整理下自己所理解到的知识。 一，jQuery.fn是什么 答：从jqurey源代码，如下小段： Java代码 jQuery.fn = jQuery.prototype = { constructor: jQuery, init: function( selector, context, rootjQuery ) { ............ ...
js/jquery常用方法------复制粘贴至剪切板
1.添加引用<script src="/XX/XX/clipboard.min.js"></script>（自己在网上下载） 2.复制按钮<button class="btn btn-info" type="button" id="btnCopy" title="复制" data-clipboard-action="copy" data-clipboard-target="#ShortURL"> 复制 </button>（加粗部分属性是必须的）<table id="table_list"></table> (此处我想操作复制的内容针对表格，这里的表格我用的jqgrid) 3.复制内容承载的文本域<textarea id="...