jQuery if..else条件语句基于哈希id提取 [英] jQuery if..else conditional statements based on hash id extracted

问题描述

我有以下HTML：

<section>
  <div class="main" id="second"> </div>
</section>
<section>
  <div class="main" id="third"></div>
</section>
<section>
  <div class="main" id="fourth"></div>
</section>

并遵循jQuery代码：

And following jQuery code:

<script>
navlist = [];
$("#navlist a").each(function(i) {
    var thisLink = $(this);
    var thisId = thisLink.attr('href');
    var thisTarget = $(thisId);
    navlist.push({
        'anchor': thisLink,
        'id': thisId,
        'target': thisTarget
    });
    thisLink.on('click', function(e) {
        e.preventDefault();
        $('html, body').animate({
            scrollTop: thisTarget.offset().top
        }, 800);
    });
});
$(window).on('scroll resize', function(e) {
    $.each(navlist, function(e, elem) {
        var placement = elem.target[0].getBoundingClientRect();
        if( placement.top<window.innerHeight && placement.bottom>0 ) {
            history.pushState({}, '', elem.id);
            console.log('Hash: ' + elem.id);
            return false; /* Exit $.each loop */
        };
    });
});
</script>

脚本的工作是允许网站上不同锚点之间平滑滚动， id点击或滚动。我想在这里使用从URL中抓取id的条件语句。

The work of the script is to allow smooth scrolling between different anchors on the site and to change URL #id on click or on scroll. I want to use here conditional statements with the id grabbed from the URL.

例如：

if(grabbedhashid == "second"){
    $(".phone").css('display', 'none');
}else{
   //display

}

<但我没有任何想法，从我从哪里可以做到。请帮我们。

But I am not having any idea as from where I can do it. Please help me guys.

示例URL ID： http：//localhost/sites/fh/index.php#first

推荐答案

所以基本上你在滚动函数中使用它，使用该脚本隐藏手机只在 #second ，它会为你工作

So basically you have it in your scroll function, use that script to hide phone only in #second, it will work for you

 $(window).on('scroll resize', function(e) {
        $.each(navlist, function(e, elem) {
            var placement = elem.target[0].getBoundingClientRect();
            if (placement.top < window.innerHeight && placement.bottom > 0) {
                history.pushState({}, '', elem.id);
                console.log('Hash: ' + elem.id);
                if(elem.id == "#second"){
                   $(".phone").css('display', 'none');
                }else{
                   $(".phone").css('display', 'block');
              }
            return false; /* Exit $.each loop */
            };

        });
 });

这篇关于jQuery if..else条件语句基于哈希id提取的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！