189 8069 5689

jquery注释,jquery注释菜鸟教程

jquery求解$("#xxx").load的问题

定义和用法

创新互联是专业的蒲江县网站建设公司,蒲江县接单;提供网站设计制作、网站设计,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行蒲江县网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!

load() 方法通过 AJAX 请求从服务器加载数据,并把返回的数据放置到指定的元素中。

注释:还存在一个名为 load 的 jQuery 事件方法。调用哪个,取决于参数。

语法

load(url,data,function(response,status,xhr))

参数

描述

url 规定要将请求发送到哪个 URL。

data 可选。规定连同请求发送到服务器的数据。

function(response,status,xhr)

可选。规定当请求完成时运行的函数。

额外的参数:

response - 包含来自请求的结果数据

status - 包含请求的状态("success", "notmodified", "error", "timeout" 或 "parsererror")

xhr - 包含 XMLHttpRequest 对象

详细说明

该方法是最简单的从服务器获取数据的方法。它几乎与 $.get(url, data, success) 等价,不同的是它不是全局函数,并且它拥有隐式的回调函数。当侦测到成功的响应时(比如,当 textStatus 为 "success" 或 "notmodified" 时),.load() 将匹配元素的 HTML 内容设置为返回的数据。这意味着该方法的大多数使用会非常简单:

$("#result").load("ajax/test.html");

如果提供回调函数,则会在执行 post-processing 之后执行该函数:

$("#result").load("ajax/test.html", function() {

alert("Load was performed.");

});

上面的两个例子中,如果当前文档不包含 "result" ID,则不会执行 .load() 方法。

如果提供的数据是对象,则使用 POST 方法;否则使用 GET 方法。

加载页面片段

.load() 方法,与 $.get() 不同,允许我们规定要插入的远程文档的某个部分。这一点是通过 url 参数的特殊语法实现的。如果该字符串中包含一个或多个空格,紧接第一个空格的字符串则是决定所加载内容的 jQuery 选择器。

我们可以修改上面的例子,这样就可以使用所获得文档的某部分:

$("#result").load("ajax/test.html #container");

如果执行该方法,则会取回 ajax/test.html 的内容,不过然后,jQuery 会解析被返回的文档,来查找带有容器 ID 的元素。该元素,连同其内容,会被插入带有结果 ID 的元素中,所取回文档的其余部分会被丢弃。

jQuery 使用浏览器的 .innerHTML 属性来解析被取回的文档,并把它插入当前文档。在此过程中,浏览器常会从文档中过滤掉元素,比如 html, title 或 head 元素。结果是,由 .load() 取回的元素可能与由浏览器直接取回的文档不完全相同。

注释:由于浏览器安全方面的限制,大多数 "Ajax" 请求遵守同源策略;请求无法从不同的域、子域或协议成功地取回数据。

更多实例

例子 1

加载 feeds.html 文件内容:

$("#feeds").load("feeds.html");

例子 2

与上面的实例类似,但是以 POST 形式发送附加参数并在成功时显示信息:

$("#feeds").load("feeds.php", {limit: 25}, function(){

alert("The last 25 entries in the feed have been loaded");

});

例子 3

加载文章侧边栏导航部分至一个无序列表:

HTML 代码:

bjQuery Links:/b

ul id="links"/ul

jQuery 代码:

$("#links").load("/Main_Page #p-Getting-Started li");

jquery ajax注释

这就是很简单的ajax请求啊,给你注释了你也不一定看懂,还不如自己看一下jquery开发文档

jquery 中 $('div','li')是什么意思?

jquery 中 $('div','li')表示的是$(子,父),即从父节点里寻找子节点,是选择li标签里面所有div标签,而不是找li标签外面的div标签。

$('div','li') 和 $('div , li') 和 $('div li') 区别

1、$('div','li')是$(子,父),是从父节点里找子,而不是找li外面的div。

2、$('div , li')才是找所有的div和li,之间不存在父子关系。

3、$('div li') 是找div里面所有li,包括子级,孙子级,总之就是div里面所有li,不管有几层关系。

扩展资料:

div用法

DIV用法的语法:div内容/div

div作为html网页中常用的标签,其默认样式是独占一行,其CSS样式需要重新赋予。比如对div宽度、高度等样式设置、内部字体大小、字体颜色都需要通过CSS来实现。

通俗认识div,div作用就是实现布局、实现对内容样式控制、实现各种各样的布局效果。

DIV的用法实例,这里通过对div设置不同CSS样式,观察其效果。

DIV+CSS实例完整HTML源代码:

!DOCTYPE html

html

head

meta charset="gb2312" /

titlediv的用法在线演示 ;/title

style

div{ margin-top:10px}/* css注释说明:对div都设置上间距10px */

divcss5-1{font-size:16px}/* 设置css字体大小16px */

divcss5-2{color:#F00}/* 设置css字体颜色为红色 */

divcss5-3{ background:#000; color:#FFF}/* 设置CSS背景颜色为黑色和字体颜色为白色 */

divcss5-4{ border:1px solid #F00; height:60px}/* 设置css边框和CSS高度60px */

/style

/head

body

div普通内容一/div

div class="divcss5-1"我字体大小为16px/div

div class="divcss5-2"我字体颜色为红色/div

div class="divcss5-3"我背景为黑色字体为白色/div

div class="divcss5-4"布局设置边框和高度/div

/body

/html

参考资料来源:

DIV-百度百科

LI-百度百科

请人帮忙给一段jquery代码加上注释。。。

$(function() { //页面加载时执行的方法

//定义getMessages方法 从服务器获取json数据

getMessages = function() {

$.getJSON('index.php?action=get_last_messages',

function(data){//这是获取成功后执行的方法

if (data.messages) {

//修改页面样式为“chat_messages”的元素中的内容为服务器返回的内容

$('.chat_messages').html(data.messages);

}

// get recent chat messages in loop

//5秒后再执行一次

setTimeout(function(){

getMessages();

}, 5000);

});

}

//执行方法getmessages 

getMessages();

//下面是jquery的ajax中post方法的写法。提交表单,然后根据服务器返回的result作出    //对于操作

$('.chat_submit_form').submit(function() {

$.post('index.php', { message: $('.chat_submit_form input[name=message]').val() },

function(data){

if (data.result == 1) {

//fadeIn  淡入显示

//fadeOut 淡出显示

$('.chat_submit_form .success').fadeIn('slow', function () {

$(this).delay(1000).fadeOut('slow');

});

} else if (data.result == 2) {

$('.chat_submit_form .protect').fadeIn('slow', function () {

$(this).delay(1000).fadeOut('slow');

});

} else {

$('.chat_submit_form .error').fadeIn('slow', function () {

$(this).delay(1000).fadeOut('slow');

});

}

}

);

//不通过表单默认的submit方式提交。

return false;

});

});

额 够完善了吧。 貌似是个在线聊天的玩意儿?

jquery图片放大镜代码解析注释

(function($){//定义作用域

$.fn.imagezoom=function(options){/*自定义插件imageszoom,options代表形参(属性自定义)*/

var settings={

xzoom: 350, /*放大图的宽度(默认是 350)*/

yzoom: 350, /*放大图的高度(默认是 350)*/

offset: 10, /*离原图的距离(默认是 10)*/

position: "right", /*放大图的定位(默认是 "right")*/

preload:1

};

if(options){

$.extend(settings,options);

}

var noalt='';

var self=this;

$(this).bind("mouseenter",function(ev){/*鼠标经过时添加一个事件处理程序*/

var imageLeft=$(this).offset().left;

var imageTop=$(this).offset().top;

var imageWidth=$(this).get(0).offsetWidth;

var imageHeight=$(this).get(0).offsetHeight;

var boxLeft=$(this).parent().offset().left;

var boxTop=$(this).parent().offset().top;

var boxWidth=$(this).parent().width();

var boxHeight=$(this).parent().height();

noalt=$(this).attr("alt");

var bigimage=$(this).attr("rel");

$(this).attr("alt",'');

if($("div.zoomDiv").get().length==0){

$(document.body).append("div class='zoomDiv'img class='bigimg' src='"+bigimage+"'//div"+

"div class='zoomMask' /div");

}

if(settings.position=="right"){

if(boxLeft+boxWidth+settings.offset+settings.xzoomscreen.width){

leftpos=boxLeft-settings.offset-settings.xzoom;

}else{

leftpos=boxLeft+boxWidth+settings.offset;

}

}else{

leftpos=imageLeft-settings.xzoom-settings.offset;

if(leftpos0){

leftpos=imageLeft+imageWidth+settings.offset;

}

}

$("div.zoomDiv").css({top:boxTop,left:leftpos});

$("div.zoomDiv").width(settings.xzoom);

$("div.zoomDiv").height(settings.yzoom);

$("div.zoomDiv").show();

$(this).css('cursor','crosshair');/*光标呈现十字线*/

$(document.body).mousemove(function(e){/*当移动鼠标时*/

mouse=new MouseEvent(e);

if(mouse.ximageLeft||mouse.ximageLeft+imageWidth||mouse.yimageTop||mouse.yimageTop+imageHeight){

mouseOutImage();/*判断鼠标是否超出图片范围*/

return;

}

var bigwidth=$(".bigimg").get(0).offsetWidth;/*最大宽度*/

var bigheight=$(".bigimg").get(0).offsetHeight;/*最大高度*/

var scaley='x';/*x轴比例 */

var scalex='y';/*y轴比例 */

/*随鼠标移动显示大图*/

if(isNaN(scalex)|isNaN(scaley)){/*x、y轴比例不是数字时*/

var scalex=(bigwidth/imageWidth);

var scaley=(bigheight/imageHeight);

$("div.zoomMask").width((settings.xzoom)/scalex);

$("div.zoomMask").height((settings.yzoom)/scaley);

$("div.zoomMask").css('visibility','visible');/*规定元素可见*/

}

xpos=mouse.x-$("div.zoomMask").width()/2;

ypos=mouse.y-$("div.zoomMask").height()/2;

xposs=mouse.x-$("div.zoomMask").width()/2-imageLeft;

yposs=mouse.y-$("div.zoomMask").height()/2-imageTop;

xpos=(mouse.x-$("div.zoomMask").width()/2imageLeft)

? imageLeft:(mouse.x+$(".zoomMask").width()/2imageWidth+imageLeft)

? (imageWidth+imageLeft-$("div.zoomMask").width()):xpos;

ypos=(mouse.y-$("div.zoomMask").height()/2imageTop)

? imageTop:(mouse.y+$("div.zoomMask").height()/2imageHeight+imageTop)

? (imageHeight+imageTop-$("div.zoomMask").height()):ypos;

$("div.zoomMask").css({top:ypos,left:xpos});

$("div.zoomDiv").get(0).scrollLeft=xposs*scalex;

$("div.zoomDiv").get(0).scrollTop=yposs*scaley;

});

});

function mouseOutImage(){/*定义鼠标离开图片方法*/

$(self).attr("alt",noalt);

$(document.body).unbind("mousemove");/*移除在页面中鼠标指针事件*/

$("div.zoomMask").remove();/*移除所有的div.zoomMask*/

$("div.zoomDiv").remove();/*移除所有的div.zoomDiv*/

}

count=0;

if(settings.preload){

/*在boby元素的结尾(仍然在内部)插入指定内容*/

$('body').append("div style='display:none;' class='jqPreload"+count+"'/div");

$(this).each(function(){/*规定为每个匹配元素规定运行的函数*/

var imagetopreload=$(this).attr("rel");/*图片预加载*/

var content=jQuery('.jqPreload'+count+'').html();

jQuery('.jqPreload'+count+'').html(content+'img src=\"'+imagetopreload+'\"');

});

}

}

})(jQuery);

function MouseEvent(e){/*记录鼠标x,y坐标*/

this.x=e.pageX;/*鼠标指针位置*/

this.y=e.pageY;

}


本文名称:jquery注释,jquery注释菜鸟教程
文章链接:http://jkwzsj.com/article/dsgdhie.html

其他资讯