jQuery库 在线

223select()

click 点击事件触发,select 事件执行多次

分析:触发了事件的默认行为

解决1:

$(document).ready(function(){ $("input").select(function(event){  event.preventDefault();  $("input").after("文本已选中!"); }); $("button").click(function(){  $("input").select(); });});

解决2:

$(document).ready(function(){ $("input").select(function(){  $("input").after("文本已选中!");  return false; }); $("button").click(function(){  $("input").select(); });});

解决3:

$(document).ready(function(){ $("input").select(function(){  $("input").after("文本已选中!"); }); $("button").click(function(){  $("input").triggerHandler("select"); });});

222on()

on() 和 click() 的区别:

二者在绑定静态控件时没有区别,但是如果面对动态产生的控件,只有 on() 能成功的绑定到动态控件中。

以下实例中原先的 HTML 元素点击其身后的 Delete 按钮就会被删除。而动态添加的 HTML 元素,使用 click() 这种写法,点击 Delete 按钮无法删除;使用 On() 方式可以。

$("#newclick").click(function(){$(".li").append('<li>动态添加的HTML元素click<button class="deleteclick">Delete</button></li>'); });
$("#newon").click(function(){
$(".li").append('<li>动态添加的HTML元素on<button class="deleteon">Delete</button></li>');
});
$(".delete").click(function(){
$(this).parent().remove();
});
$(".li").on('click', ".deleteon", function(){
$(this).parent().remove();
});
$(".deleteclick").click(function(){
$(this).parent().remove();
});

221jQuery AJAX 简介

<p>&nbsp; jquery 加载 html文件 指定内容很实用<br></p>

220jQuery css() 方法

文章的第一段代码中,只获取到了第一个 p 标签的 background-color,那么怎么才能获取到第二或第三个 p 的背景颜色呢,加入选择器:nth-child()
<div id="nth-child-tester">
<h2>这是一个标题</h2>
<p style="background-color:#ff0000">这是一个段落。</p>
<p style="background-color:#00ff00">这是一个段落。</p>
<p style="background-color:#0000ff">这是一个段落。</p>
<button>返回第一个 p 元素的 background-color </button></div>
$("button").click(function(){
alert("p1背景颜色 = " + $("#nth-child-tester p:nth-child(2)").css("background-color"));
alert("p2背景颜色 = " + $("#nth-child-tester p:nth-child(3)").css("background-color"));
alert("p3背景颜色 = " + $("#nth-child-tester p:nth-child(4)").css("background-color"));
});

这是一个标题

这是一个段落。

这是一个段落。

这是一个段落。

PS: 这里 :nth-child() 选择器默认以 body 作为父标签,所以 :nth-child(1)

218jQuery 捕获

prop()函数的结果:

      1.如果有相应的属性,返回指定属性值。

      2.如果没有相应的属性,返回值是空字符串。

attr()函数的结果:

      1.如果有相应的属性,返回指定属性值。

      2.如果没有相应的属性,返回值是undefined。

对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。

对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。

具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop()