扫码关注官方订阅号
举个例子:
demo.html
Click one Click one Click three
Click one
Click three
请问当我点击第一个 button 后,该如何用 $(this) 如何获得第二个 button 的 text 值.
这里的 3 个 class="one" 的 p 都是可以随意删除的.
人生最曼妙的风景,竟是内心的淡定与从容!
借用公子的fiddle改了一下,供参考,主要是使用了closest这个方法。
closest
http://jsfiddle.net/whxvaeou/5/
原来之前的评论中已经提到了呀,重复了,呵呵。
jquery主要就是dom操作,所以页面结构布局在设计方面就得考虑清楚。具体业务具体处理,并没有什么通用的解决办法。
原先的答案,没有覆盖动态增删的场景。
var $btnArr = $(".btn") ; $btnArr.each(function(i,elem){ $btnArr.eq(i).on("click", function(evt){ alert( $btnArr.eq(i+1).text() ) ; }); });
新答案:
既然题目变成了动态增删,个人认为最优的答案已经由@KevinYue给出,美刀符只出现了一次,省资源:)
那么我来一个原生方案好了。扩展一下,假设它们有一个共同的父级#container.
var cont = document.getElementById("container") , children = cont.getElementsByClassName("btn") ; cont.addEventListener("click",function(evt){ var target = event.target , curChildrenArr = Array.prototype.slice.call(children) , indexOfTarget = curChildrenArr.indexOf(target); if( indexOfTarget < curChildrenArr.length - 1 ) { alert(curChildrenArr[indexOfTarget+1].innerText) } },false) ;
http://jsfiddle.net/ruart0vz/1/
知识点在于getElementsByClassName返回的是一个live node list,每次调用都会查询最新版本的DOM,因此不会有更新问题。
getElementsByClassName
//http://jsfiddle.net/whxvaeou/2/ $(function() { $(document).on("click", ".btn", function() { var btns = $(".btn"); for(var i=0, l=btns.length; i<l; i++) { if(btns[i] == this && i != l) { $(btns[i+1]).css('color', 'red'); break; } } }) });
var tt = $("button").eq(1).text(); alert(tt);
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
借用公子的fiddle改了一下,供参考,主要是使用了
closest这个方法。http://jsfiddle.net/whxvaeou/5/
原来之前的评论中已经提到了呀,重复了,呵呵。
jquery主要就是dom操作,所以页面结构布局在设计方面就得考虑清楚。具体业务具体处理,并没有什么通用的解决办法。
原先的答案,没有覆盖动态增删的场景。
新答案:
既然题目变成了动态增删,个人认为最优的答案已经由@KevinYue给出,美刀符只出现了一次,省资源:)
那么我来一个原生方案好了。扩展一下,假设它们有一个共同的父级#container.
http://jsfiddle.net/ruart0vz/1/
知识点在于
getElementsByClassName返回的是一个live node list,每次调用都会查询最新版本的DOM,因此不会有更新问题。var tt = $("button").eq(1).text();
alert(tt);