如何检查元素是不是可见并使用 JQuery 检查 URL 是不是包含字符串？

Posted 2023-02-23

【中文标题】如何检查元素是不是可见并使用 JQuery 检查 URL 是不是包含字符串？

【英文标题】：How do I check if an element is visible and check if the URL contains a string using JQuery?如何检查元素是否可见并使用 JQuery 检查 URL 是否包含字符串？

【发布时间】：2017-06-12 10:35:25

【问题描述】：

所以我有一个包含 #gallery-carousel-3 的 URL。当用户单击右侧图标 (.icon.icon-arrow-right) 时，将添加 .blockd 类。这很好用。但是，当用户单击左侧图标（.icon.icon-arrow-left）时，如果 URL 包含 #gallery-carousel-3 并且 .panel-display div 可见，我想删除 .blockd 类。我似乎无法让第二部分工作

我的代码如下：

      jQuery(document).ready( function($) 

            $('.icon.icon-arrow-right').click(function()

              if(window.location.href.indexOf("#gallery-carousel-3") > -1 && $('.ad-panel').filter(':visible').length == 0 ) 
                $('.owl-wrapper-outer').addClass('blockd');

                       

            );

            $('.icon.icon-arrow-left').click(function()


              if(window.location.href.indexOf("#gallery-carousel-3") > -1 && $('.panel-display').is(':visible')) 
                $('.owl-wrapper-outer').removeClass('blockd');
                          


            );
      );  

【问题讨论】：

能否在if 条件if(window.location.href.indexOf("#gallery-carousel-3") > -1 && $('.panel-display').is(':visible')) 之前添加一条警告语句alert($('.panel-display').is(':visible')) 以验证.panel-display 确实可见？

是的，我要检查一下。

【参考方案1】：

您可以使用：location.hash 获取 url 中哈希 (#) 的值

所以，假设你的网址是http://example.com/#gallery-carousel-3

var urlHash = location.hash; // => #gallery-carousel-3

【讨论】：

我理解并且 location.hash 返回位置。我试图弄清楚为什么 if(window.location.href.indexOf("#gallery-carousel-3") > -1 && $('.panel-display').is(':visible')) 不能正常工作

啊，然后打开你的 chrome 开发工具并检查 if() 的哪一部分没有通过。我怀疑$('.panel-display').is(':visible') 不是真的

好的，我去看看。这让我走上了正确的道路