大佬教程收集整理的这篇文章主要介绍了javascript – jQuery if语句导致浏览器崩溃,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
这是html:
<div class="home-middle-buttons"> <div class="first-button"> <span>I’m an In-House Marketer</span> </div> <div class="second-button"> <span>I Work at an Agency</span> </div> <div class="third-button"> <span>I’m a Business owner</span> </div> </div> <div class="home-middle-content"> <div class="first-button-content"> <p>Lorem ipsum dolor</p> </div> <div class="second-button-content"> <p>Lorem ipsum dolor</p> </div> <div class="third-button-content"> <p>Lorem ipsum dolor.</p> </div> </div>
这是脚本:
jQuery(document).ready(function() { jQuery(".home-middle-buttons div").click(function() { if (jQuery(".first-button").click()) { jQuery(".first-button-content").css( 'display','block' ); } else { jQuery(".second-button-content").css( 'display','block' ); } }); });
if (jQuery(".first-button").click()) {
调用.click()实际上会触发click事件,它不会测试是否发生了单击.那么接着调用你的点击处理程序,它会到达那一行并触发一个调用处理程序等的点击.
试试这个:
if (jQuery(this).hasClass("first-button")) {
在您的单击处理程序中,这指的是单击的特定按钮,jQuery的.hasClass()返回一个布尔值,表示该元素是否具有该类.
但是设置整个过程的更好方法如下:
<div class="home-middle-buttons"> <div data-associated-content="first-button-content"> <span>I’m an In-House Marketer</span> </div> <div data-associated-content="second-button-content"> <span>I Work at an Agency</span> </div> <div data-associated-content="third-button-content"> <span>I’m a Business owner</span> </div> </div> <div class="home-middle-content"> <!-- as in the question --> </div>
有了这个JS:
jQuery(document).ready(function() { jQuery(".home-middle-buttons div").click(function() { var associatedDiv = jQuery(this).attr("data-associated-content"); jQuery("." + associatedDiv).show(); }); });
注意:如果数据相关内容似乎有点长时间使用数据 – 更短的东西.此外,您的内容div上的类似乎唯一地标识这些div,所以我建议将它们设为id而不是类更合乎逻辑.
以上是大佬教程为你收集整理的javascript – jQuery if语句导致浏览器崩溃全部内容,希望文章能够帮你解决javascript – jQuery if语句导致浏览器崩溃所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。