JQUERY - 技术教程文章

jQuery实战4:标签页效果【代码】【图】

今天我们来完成《jQuery实战》系列的标签页效果。先来看一看效果图 这里有两部分的内容,上面是一个标签页的效果,下面也是一个标签页的效果。在实际应用中也经常会见到标签页的效果,它的作用主要是在页面可视区有限的情况下展示更多的内容。当用户想看其他内容的时候不需要离开页面,只需要把鼠标移动到某一个标签上就可以看到这个标签里面所对应的内容。门户网站的首页,有很多频道都是标签页的最佳案例,如体育、财经、军事等...

JQuery判断form表单是否为空【代码】

功能:通过jquery判断form表单中是否有内容还未填写,如果有未填写的,则阻止提交$(function () {$(‘form‘).bind(‘submit‘,function () { //给form标签绑定submit事件var i=0;$("input").each(function(){ //遍历input标签,判断是否有内容未填写var vl=$(this).val();if(vl==""){i=1;}});var t=$(‘textarea‘).val(); //判断textarea标签是否填写if (t==‘‘) {i=1;}if (i==1) { //如果有未填写的,则return false阻止提...

jQuery 获得内容【代码】【图】

地址text() - 设置或返回所选元素的文本内容html() - 设置或返回所选元素的内容(包括 HTML 标记)val() - 设置或返回表单字段的值一、text() html()<!DOCTYPE html><html><head><meta charset="utf-8"><script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script><script> $(document).ready(function(){$("#btn1").click(function(){alert("Text: "+ $("#test").text());});$("#btn2").click(function(){a...

客户端 jQuery 跨端口 调用 node 服务端

一句话 很顶用response.setHeader(‘Access-Control-Allow-Origin‘, ‘http://127.0.0.1:8020‘); 说 响应的头文件里设置 一个 http://127.0.0.1:8020 允许 它访问纠结了好久 菜的 不行不行 原文:http://www.cnblogs.com/ganmk--jy/p/5641901.html

jquery实现ajax传递【图】

在请求的php页面中从数据库取得数据;对数据进行json_encode在申请的页面进行jquery.$.ajax();650) this.width=650;" src="/upload/getfiles/default/2022/11/9/20221109041053680.jpg" title="捕获.PNG" />650) this.width=650;" src="/upload/getfiles/default/2022/11/9/20221109041053961.jpg" title="1111111.PNG" />4.返回的若是2维的数组,jquery可以用each遍历650) this.width=650;" src="/upload/getfiles/default/2022/1...

Ajax json jquery实现菜单案例【代码】【图】

需求:运用AJAX请求文件menu.json,配置菜单栏,并实现以下功能点: 1. 点击向左箭头,菜单向左移动,隐藏 2. 点击向右箭头,菜单向右移动,显示3. 点击一级菜单,被点击菜单的子菜单显示,其他兄弟节点的子菜单隐藏 页面显示:ajaxTest\WebRoot\nav.html 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/xht...

Jquery JS 获取 Checkbox 是否选中

正确方法: var isReturned = document.getElementById(‘cboxReturned‘).checked; 错误方法: var isReturned = $("#cboxReturned").attr("checked");原文:http://www.cnblogs.com/ouwenlingzhi/p/5832660.html

jQuery选择器总结

jQuery选择器总结 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631...

jquery工具方法proxy【代码】

proxy : 改变this指向使用方法1:function show(){  alert(this);}$.proxy(show,document)(); //document使用方法2:function show(n1,n2){  alert(n1);  alert(n2);  alert(this);}$.proxy(show,document)(3,4); //document 3 4$.proxy(show,document,3,4)(); //document 3 4$.proxy(show,document,3)(4); //document 3 4使用方法3:var obj = {  show:function(){    alert(this);  }};$(document).cl...

table 表头固定 thead固定. 1) 使用jquery.freezeheader.js【代码】【图】

方法一: 使用jquery.freezeheader.js 固定表头: 1-: 初始化: 1<!DOCTYPE html> 2<html lang="en"> 3<head> 4<meta charset="UTF-8"> 5<title>表格table固定thead表头</title> 6<style type="text/css"> 7 8 table { 9 border: 1px solid red; 10 border-collapse: collapse; 11 12 width: 500px; 13 14 15} 16 tr, td { 17 border: 1px solid black; 18 ...

jQuery事件之键盘事件

一、首先需要知道的是: 1、keydown() keydown事件会在键盘按下时触发. 2、keyup() keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件 3、keypress() keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键 二、获得键盘上对应的ascII码: $(document).keydown(function(event){ alert(event.keyCode); }); $tips: 上面例子中,event.keyCode就可以帮助我们获取到我们按下了键盘上的什么按键,他返回的是ascI...

jQuery判断 form表单提交时如果表单里有input标签为空那么不提交form表单【代码】

<head><script type="text/javascript">$("#sub1").click(function(){var text1=$("#text1").val();if(text1==""){alert("不能为空!");$("#text1").select();$("#text1").focus();}else{$("#form1").submit();}})</script></head><body><form id="form1" method="post" action=""><input type=text id="text1"/><input type="submit" id="sub1"搜索 value="提交"></form></body> 原文:http://www.cnblogs.com/sunhaoyu/p/4821499....

MVC验证11-对复杂类型使用jQuery异步验证【代码】【图】

本篇体验使用"jQuery结合Html.BeginForm()"对复杂类型属性进行异步验证。与本篇相关的"兄弟篇"包括:MVC验证08-jQuery异步验证 MVC验证09-使用MVC的Ajax.BeginForm方法实现异步验证 MVC验证10-到底用哪种方式实现客户端服务端双重异步验证 准备工作□ js方面:1、jquery的某个版本2、jquery.validate.js3、jquery.validate.unobtrusive.js□ Web.config: <appSettings> ... <add key="ClientValidation...

jQuery高级编程

jquery高级编程1.jquery入门2.Javascript基础3.jQuery核心技术4.选择和操作Dom元素5.事件处理6.Html表单,数据和AJAX7.动画和特效jQuery应用8.jQueryUI 更轻松创建web界面9.jQueryUI 鼠标交互10.编写高效的jQuery代码11.jQuery模板12.编写jQuery插件13.使用jQuery Deferred对象,进行高级异步编程14.使用QUnit进行单元测试原文:http://www.cnblogs.com/sujingnuli/p/5772521.html

jQuery滑动星星评分效果【代码】【图】

每日分享效果,今天分享一个jQuery滑动星星评分效果。 jQuery星星评分制作5颗星星鼠标滑过评分打分效果,可取消评分结果,重新打分。HTML代码:<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" href="css/css.css"><script src="js/jquery.js"></script> </head> <body> <div ><p ><span><i ></i><i ></i></span><span><i ></i><i ></i></span><span><i ></i><i ></i><...

[ jquery 文档处理 appendTo(content) ] 此方法用于把所有匹配的元素追加到另一个指定的元素集合中【代码】

把所有匹配的元素追加到另一个指定的元素元素集合中。实际上,使用这个方法是颠倒了常规的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中。在jQuery 1.3.2中,appendTo, prependTo, insertBefore, insertAfter, 和 replaceAll这个几个方法成为一个破坏性操作,返回值是所有被追加的内容,而不仅仅是先前所选中的元素。所以,要选择先前选中的元素,需要使用end()方法,参见例二。实例:<html lang=‘zh-cn‘> <head> ...

jquery 弹窗信息显示几秒后自动消失【代码】

CSS 样式:alert {display: none;position: fixed;top: 50%;left: 50%;min-width: 300px;max-width: 600px;transform: translate(-50%,-50%);z-index: 99999;text-align: center;padding: 15px;border-radius: 3px; }.alert-success {color: #3c763d;background-color: #dff0d8;border-color: #d6e9c6; }.alert-info {color: #31708f;background-color: #d9edf7;border-color: #bce8f1; }.alert-warning {color: #8a6d3b;background...

jquery deferred done then区别【代码】

jquery deferred done then区别deferred是jquery 对promise的实现。以下内容基于jquery 1.8及以上版本deferred具有then done等属性。其区别在于Deferred resolved时,done返回当前的的deferred object,callback的返回值不会被传递 then返回一个新的deferred object,callback的返回值会被传递(参考jquery的pipe属性)给新的callback 通过以下的例子来理解下实际的运行效果。var defer = jQuery.Deferred();defer.done(function(a...

jQuery中的动画

一、基本动画1、show()方法和hide()方法:改变display属性为一个元素调用hide()方法,会将该元素的display样式改为“display:none”。$(“element”).hide() //通过hide元素隐藏元素$(“element”).css(“display: none”) //通过css()方法隐藏元素以上两种隐藏元素的方法效果一致在元素调用了hide()方法后,可以为该元素调用show()方法将元素的display样式设置为hide()方法调用之前的显示状态(“blo...

Jquery10 高级事件【代码】【图】

学习要点:1.模拟操作2.命名空间3.事件委托4.on、off 和 one jQuery 不但封装了大量常用的事件处理,还提供了不少高级事件方便开发者使用。比如模拟用户触发事件、事件委托事件、和统一整合的 on 和 off,以及仅执行一次的 one 方法。这些方法大大降低了开发者难度,提升了开发者的开发体验。一.模拟操作在事件触发的时候,有时我们需要一些模拟用户行为的操作。例如:当网页加载完毕后自行点击一个按钮触发一个事件,而不是用户去...

pagination jquery最简单的分页【无刷新和刷新都通用】【代码】【图】

参数说明参数名描述参数值maxentries总条目数 必选参数,整数items_per_page每页显示的条目数 可选参数,默认是10num_display_entries连续分页主体部分显示的分页条目数 可选参数,默认是10current_page当前选中的页面 可选参数,默认是0,表示第1页num_edge_entries两侧显示的首尾分页的条目数 可选参数,默认是0li...

jquery-放大镜【图】

效果图650) this.width=650;" src="/upload/getfiles/default/2022/11/9/20221109042917451.jpg" title="QQ截图20161215152647.png" />650) this.width=650;" src="/upload/getfiles/default/2022/11/9/20221109042917893.jpg" title="QQ截图20161215152702.png" />代码部分html内容:<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>放大镜</title></head><body...

jQuery DateTimePicker 日期控件

在线实例实例演示使用方法<input?id="datetimepicker"?type="text"?>复制$(‘#datetimepicker‘).datetimepicker();复制参数详解参数描述默认值lang语言选择中文 “ch”-format格式化日期-timepicker是否开启时间选项falseyearStart设置最小年份-yearEnd设置最大年份-todayButton关闭选择今天按钮-下载原文:http://zaixianshouce.iteye.com/blog/2311590

jquery特效收藏第三期

1.flash制作房地产楼盘展示效果图http://www.xwcms.net/js/flash-bannertp/48731.html2.flash制作夜空老鹰飞翔动画http://www.xwcms.net/js/flashdhsc/97486.html3.flash制作三种彩色鸽子飞翔http://www.xwcms.net/js/flashdhsc/42877.html4.jQuery制作图片排版flipLightBox灯箱弹窗插件http://www.xwcms.net/js/tpdm/88174.html5.jQuery制作Akordeon可折叠手风琴插件代码http://www.xwcms.net/js/xxk-hdm/34163.html6.jQuery自适应...

jQuery源码05 (3653 , 3797) queue() : 队列方法 : 执行顺序的管理【代码】

//对外接口jQuery.extend({queue: function( elem, type, data ) {//入队。元素、队列名字、存进去的函数//jQuery.queue( this, type, function( next, hooks ) {})var queue;if ( elem ) {type = ( type || "fx" ) + "queue";//不写队列名字就是fx// $.queue( document , ‘q1‘ , aaa||[aaa,bbb] ); queue = data_priv.get( elem, type );//get方法var cache = this.cache[ this.key( elem ) ];return type === undefined ? c...

JQuery 的了解【代码】【图】

jquery的核心理念: The Write Less Do More.(写的少,做的多),一个轻量级的js库,,jQuery2.0及后续版本将不再支持IE6/7/8浏览器。任何库与框架设计的第一个要点就是解决命名空间与变量污染的问题。jQuery就是利用了JavaScript函数作用域的特性,采用立即调用表达式包裹了自身的方法来解决这个问题。jquery的核心函数,指一个工厂对象,即jquery()函数,或者别名$() 函数。jquery 在页面DOM元素加载完成后执行,(不必等待所有元...

ligerui的jquery.validate验证需要添加validate="{required:true,minlength:8,equalTo:'#newpassword'}"【图】

ligerui的jquery.validate验证需要添加validate="{required:true,minlength:8,equalTo:‘#newpassword‘}" #newpassword'}"' ref='nofollow'>ligerui的jquery.validate验证需要添加validate="{required:true,minlength:8,equalTo:'#newpassword'}"原文:http://www.cnblogs.com/oymx/p/3969937.html

jQuery源码分析之=>jQuery的定义【代码】

最近写前段的代码比较多,jQuery是用的最多的一个对象,但是之前几次看了源码,都没搞清楚jQuery是怎么定义的,今天终于看明白怎么回事了。记录下来,算是一个新的开始吧。(文中源码都是jQuery-1.10.2版本的) 先上一段jQuery定义的源码,定义了jQuery为一个function1// Define a local copy of jQuery2 jQuery = function( selector, context ) { 3// The jQuery object is actually just the init constructor ‘enha...

Jquery 获取 radio选中值

1.获取选中值,三种方法都可以:$(‘input:radio:checked‘).val();$("input[type=‘radio‘]:checked").val();$("input[name=‘rd‘]:checked").val();2.设置第一个Radio为选中值: $(‘input:radio:first‘).attr(‘checked‘, ‘checked‘);或者$(‘input:radio:first‘).attr(‘checked‘, ‘true‘);注:attr("checked",‘checked‘)= attr("checked", ‘true‘)= attr("checked", true)3.设置最后一个Radio为选中值:$(‘...

jquery 如何给新生成的元素绑定 hover事件?【代码】

$("table tr").live({ mouseenter: function() { //todo }, mouseleave: function() { //todo }}); $(‘ul li‘).live(‘mouseenter‘,function(){ $(‘#tips‘).show();}).live(‘mouseleave‘,function(){ $(‘#tips‘).hide();});原文:http://www.cnblogs.com/yanglian/p/4200987.html