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"); });});
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(); });
<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) 是
prop()函数的结果:
1.如果有相应的属性,返回指定属性值。
2.如果没有相应的属性,返回值是空字符串。
attr()函数的结果:
2.如果没有相应的属性,返回值是undefined。
对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop()
感谢您的支持,我会继续努力的!
支付宝扫一扫,即可进行扫码打赏哦
223select()
click 点击事件触发,select 事件执行多次
分析:触发了事件的默认行为
解决1:
解决2:
解决3:
222on()
on() 和 click() 的区别:
二者在绑定静态控件时没有区别,但是如果面对动态产生的控件,只有 on() 能成功的绑定到动态控件中。
以下实例中原先的 HTML 元素点击其身后的 Delete 按钮就会被删除。而动态添加的 HTML 元素,使用 click() 这种写法,点击 Delete 按钮无法删除;使用 On() 方式可以。
221jQuery AJAX 简介
220jQuery css() 方法
这是一个标题
这是一个段落。
这是一个段落。
这是一个段落。
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()