jquery事件 | 易学教程

jQuery右键菜单contextMenu实例

阅读更多关于 jQuery右键菜单contextMenu实例

URL: http://www.cnblogs.com/whitewolf/archive/2011/09/28/2194795.html http://www.blogjava.net/supercrsky/articles/250091.html 好久没写博客了，今天简单介绍一款jQuery鼠标右键菜单contextMenu，这里首先要感谢我的漫漫程序之旅（原文 http://www.blogjava.net/supercrsky/articles/250091.html ）。在最近项目中需要频繁的右键菜单操作。我采用了contextMenu这款jQuery插件。在下面我们将设计一个场景，表格grid需要在每行实现鼠标右键，增加，删除，保存操作。grid我就用gridview了，随便用微软提供的样式，测试用例不用搞的多好看嘛，我也不是做美工了，哈哈，偷偷懒。先上效果图，是有些同志说的有图才有真相嘛： ui代码： View Code 注： 1：contextMenu我们互根据数据记录隐藏一些菜单项，这个可以在onShowMenu事件中，根据 e.currentTarget触发源获取数据，在根据remove菜单项。比如测试用例中的：如果id>10则不允许保存 if (parseInt($("td:eq(0)", e.currentTarget).text()) > 10) {

jQuery基本知识

阅读更多关于 jQuery基本知识

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　jQuery知识结构 * jQuery入门? * js函数库(DOM/ajax) * 特点: * HTML元素选取 * HTML元素操作 * CSS操作 * HTML事件处理 * JS动画效果 * 链式调用 * 浏览器兼容 * Ajax封装 * 易扩展插件 * helloworld * 引入库 * 引入库文件到项目中 * 在页面中引入 * 使用库 * 使用jQuery核心函数 : $/jQuery * 使用jQuery核心对象 : 使用调用$()返回的结果 $(function(){ $('#demo').click(function(){ //处理点击响应逻辑 }); }); * 回调函数: * 你定义的 * 你没有调用 * 但它最终执行了(一定时机/条件) * jQuery的2把利器 * jQuery核心函数 : * $/jQuery : jQuery库定义的两个全局函数 * 作为一般函数调用 : $(params) * callback function : 绑定文档加载完成的回调 * 选择器字符串 : 查找所有匹配的dom元素, 并包装为jQuery对象返回 * 标签字符串 : 生成dom元素对象, 并包装为jQuery对象返回 * dom元素对象: 将指定的dom元素包装为jQuery对象返回

jQuery UI Autocomplete 体验

阅读更多关于 jQuery UI Autocomplete 体验

原文: http://www.cnblogs.com/lwme/archive/2012/02/12/jquery-ui-autocomplete.html jQuery UI Autocomplete 是jQuery UI的自动完成组件，是我用过的最强大、最灵活的Autocomplete，它支持本地的Array/JSON数组、通过ajax请求的Array/JSON数组、JSONP、以及Function(最灵活)等方式来获取数据。支持的数据源 jQuery UI Autocomplete 主要支持字符串 Array 、 JSON 两种数据格式。普通的Array格式没有什么特殊的，如下： ? 1 [ "cnblogs" , "博客园" , "囧月" ] 对于JSON格式的Array，则要求有： label 、 value 属性，如下： ? 1 [{label: "博客园" , value: "cnblogs" }, {label: "囧月" , value: "囧月" }] 其中label属性用于显示在autocomplete弹出菜单，而value属性则是选中后给文本框赋的值。如果没有指定其中一个属性则用另一个属性替代(即value和label值一样)，如下： ? 1 2 [{label: "cnblogs" }, {label: "囧月" }] [{value:

jquery对dom节点的操作

阅读更多关于 jquery对dom节点的操作

3 月，跳不动了？>>> 1、 JavaScript脚本放在哪里才好？　 1.当有些函数需调用才执行或者有些事件需触发才执行的脚本，我们可以将脚本放在 HTML的head 部分中,这样可以保证脚本在任何调用之前已经被加载。　2.当页面加载时需执行的脚本可以放在HTML的body部分，这类脚本通常被用来生成页面的内容。　3.当页面加载后需立即执行的脚本，我们可以放在最后，文档加载之后执行。所幸的是，Jquery有事件控制，所以，这部分我们可以下载 head 引用的外部文件中。 2、jquery的常用函数（ http://www.cnblogs.com/Jolinson/p/3441209.html ）如： children() 、 parent()、 each()、 text()、 html()、 val()、 next()； <ul class="level-1"> <li class="item-i">I</li> <li class="item-ii">II <ul class="level-2"> <li class="item-a">A</li> <li class="item-b">B <ul class="level-3"> <li class="item-1">1</li> <li class="item-2">2</li> <li

jQuery的学习笔记

阅读更多关于 jQuery的学习笔记

JQuery学习笔记 Chapter one初识jQuery 1.2测试jQuery 在jQuery库中，$是jQuery的别名，如：$()相当于jQuery（）注意：在使用JQuery进行开发的时候如果在做所有事情之前，希望jQuery操作DOM文档，就必须保证在DOM载入完毕后开始执行，应该使用ready事件作为处理HTML文档的开始。 1.4JQuery的核心功能 1.对外接口单一让使用更简单 2.链式语法让编码更加的快速和优雅 3.模仿CSS选择器让选取元素更加的精确的灵活 4.拓展接口让JQuery更开放，富有活力 1.5容易混淆的几个概念ＤＯＭ对象是文档对象模型ＪＱｕｅｒｙ对象实际上是普通的ＪａｖａＳｃｒｉｐｔ对象，他其中包含了ＤＯＭ对象的集合。ＪＱｕｅｒｙ对象不能调用ＤＯＭ对象的方法，ＤＯＭ也不能调用ＪＱｕｅｒｙ对象的方法和属性，如果非要使用的话，可以把JQuery对象转换为DOM对象，方法有两种：一种是借助数组下标来读取JQuery对象集合中的某个ＤＯＭ对象；例如： <!DOCTYPE html>  <html> <head lang="en"> <meta charset="UTF-8"> <script src="../jquery/jquery-1.11.3.js"

事件、监听、jQuery、轮播手动

阅读更多关于事件、监听、jQuery、轮播手动

a链接事件阻止默认行为 return false HTML元素大都包含了自己的默认行为，例如：超链接、提交按钮等。我们可以通过在绑定事件中加上return false来阻止它的默认行为。通用性的事件监听方法 1.绑定HTML元素属性 <input type="button" value="clickMe" onClick="check(this)"> 2 绑定dom对象属性 document.getElementById("btn1").onClick=test; //test函数名两种添加事件方式 1. function show(){ alert("你点击了我"); 2.document.getElementById("mytest1").onclick=show; //+()是调用,不+是参数 function show(){ aler t("你点击了我"); } //页面加载完成后调用 window.onload=function(){ /*第二种添加事件方式*/ document.getElementById("mytest1").onclick=show; } 标准DOM事件监听方法 [object].addEventListener(“事件类型”,”处理函数”,”冒泡事件或捕获事件”); var bt1=document.getElementById(

JQuery Tips(1)----关于$.Ready()

阅读更多关于 JQuery Tips(1)----关于$.Ready()

最近一直在研究JQuery,这个东西还是很博大精深的.下面分享一下我的学习总结. $(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法接触JQuery一般最先学到的是何时启动事件。在曾经很长一段时间里,在页面载入后引发的事件都被加载在”Body”的Onload事件里. 对于Body的Onload事件和JQuery的Ready方法相比，有很多弊端.比如: 1.加载多个函数的问题 <body onload="a();b();"> </body> 在Onload事件中只能这样加载，很丑陋…而在JQuery中你可以利用多个JQuery.Ready()方法，它们会按次序依次执行 2.代码和内容不分离这个貌似不用说了，让人深恶痛绝-.-!! 3.执行先后顺序不同对于Body.Onload事件，是在加载完所有页面内容才会触发，我的意思是所有内容, 包括图片，flash等.如果页面的这些内容很多会让用户等待很长时间. 而对于$(document).ready()方法，这个方法只是在页面所有的DOM加载完毕后就会触发,无疑很大的加快了网页的速度. 但是对于一些特殊应用，比如图片的放大缩小，图片的剪裁。需要网页所有的内容加载完毕后才执行的呢？我推荐使用$(window).load()方法，这个方法会等到页面所有内容加载完毕后才会触发

js中的window.onload和jquery中的load区别

阅读更多关于 js中的window.onload和jquery中的load区别

JavaScript 中的以下代码 : Window.onload = function (){ // 代码 } 等价于 Jquery 代码如下： $(window).load( function (){ // 代码 }); window.load $(document).ready() 执行时机必须等待网页中所有的内容加载完毕后 ( 包括图片 ) 才能执行网页中所有 DOM 结构绘制完毕后就执行，可以能 DOM 元素关联的内容并没有加载完编写个数不能同时编写多个以下代码无法正确执行： window.onload = function(){ alert(“text1”); }; window.onload = function(){ alert(“text2”); }; 结果只输出第二个能同时编写多个以下代码正确执行： $(document).ready(function(){ alert(“Hello World”); }); $(document).ready(function(){ alert(“Hello again”); }); 结果两次都输出简化写法无 $(function(){ // do something }); 以浏览器装载文档为例，在页面加载完毕后，浏览器会通过 Javascript 为 DOM 元素添加事件。在常规的 Javascript

初识jQuery

阅读更多关于初识jQuery

jQuery是JS对象和实用函数的封装。 jQuery与JS相比的优势是语法更简单、也不存在兼容性问题。 jQuery是JS的程序库。 jQuery的用途：访问和操作DOM元素控制页面样式对页面事件的处理方便地使用jQuery插件与Ajax技术的完美结合 jQuery的优势：轻量级，只有100kb 强大的选择器，几乎支持所有CSS选择器出色的DOM封装。可靠的事件处理机制出色的浏览器兼容性隐式迭代丰富的插件支持 jQuery主要包含三部分：工厂函数 $ $(selector).action(); $符号等价于jQuery。 DOM对象必须用双引号包裹起来，document对象则写作$(document)。选择器 selector $(ID选择器、类选择器、标签选择器); 方法 action() jQuery用于操作CSS的操作之一： jQuery对象.addClass([样式名]); 样式名可以是多个，用空格隔开。 css(“属性”,”属性值”); //设置一个css css({“属性1”:”属性值1”,”属性2”:”属性值2”})；//设置多个css $(selector).show(); //显示样式 $(selector).hide(); //隐藏样式 css()与addClass()方法的区别： css(

深入jQuery中的data()

阅读更多关于深入jQuery中的data()

引入　　data函数在jQuery中看起来很不起眼, 就像沙滩上一颗平凡的沙子, 但仔细一瞅, 却惊讶的发现data是jQuery中无比重要的一环, 甚至jQuery中各种事件都基于此。 data有什么作用？　　在我们平时js编码过程中，我们经常会向DOM元素中添加各种自定义属性，这样有一个弊端。　　1 假设我们在DOM元素中添加了一个属性，这个属性指向了某个js对象。 dom1.ele = jsObj 　　2 当这个js对象发挥完作用后，我们已经用不到他了。这时候按理说应该把这个js变量清空，释放内存。大家都知道，如果一个js对象不存在任何外在引用的话，解释器会自动将其在内存中删除，这也是javascript相对于c++等手动管理内存的程序的优点。　　3 但是这时候问题来了，因为DOM元素引用了这个js对象，尽管这个js对象已经没有存在的意义了，但是解释器是不会把他删除的。如果想要把其删除，我们可能需要将DOM元素的这个属性设置为null。　　4 我们编写了这么多的代码，哪里能把每个js对象是不是被DOM元素引用了都记住啊？　　5 而且，假如DOM元素与js对象之间相互循环引用，根本就无法删除！这就是内存泄漏　　6 所以，为了避免这种情况的发生，我们要尽量避免引用数据 (这里的引用数据可以说是javascript对象) 直接依附在DOM对象上。　　7

订阅 jquery事件