Question

我试图在jQuery函数中忽略带有空href属性的a。这是菜单：

<nav id="nav-works-screen" role="navigation">
    <ul id="nav-other-links">
        <li class="nav-title">NICHOLAS<br/> AREHART</li><br/>
        <li><a href="">CV/Bio</a></li>
        <li><a href="">Contact</a></li>
        <li><a href="">News</a></li>
        <li><a href="<?php randLink() ?>">Link???</a></li>
    </ul>
    <ul id="nav-works">
        <li class="nav-title">WORK</li><br/>
        <li class="work"><a href="#the-speech">The Speech</a></li>
        <li class="work"><a href="#forms-derived-from-a-code">Forms Derived from a Code</a></li>
        <li class="work"><a href="#unauthorized-reproduction">Unauthorized Reproduction</a></li>
        <li class="work"><a href="">Newport Ads</a></li>
        <li class="work"><a href="">An Illegally Downloaded Film</a></li>
        <li class="work"><a href="">Hold on to Your Genre</a></li>
        <li class="work"><a href="">Autonomy</a></li>
        <li class="work"><a href="">Ikea Objects</a></li><br/>
        <li id="nav-arrows"> 
            <div class="nav-arrows">
                <a class="nav-arrow-prev" href="">&laquo;</a>
            &emsp;&emsp;
                <a class="nav-arrow-next" href="">&#187;</a>
            </div>
        </li>
    </ul>
</nav>

主播：

<div id="content" class="clrfx">

    <div id="primary" class="clrfx">
        <div id="the-speech" class="page odd the-speech">
            <div class="page-content">
                <h2>The Speech</h2>
            </div>
        </div>

        <div id="forms-derived-from-a-code" class="page even forms-derived-from-a-code">
            <div class="page-content">
                <h2>Forms Derived from a Code</h2>
            </div>
        </div>

        <div id="unauthorized-reproduction" class="page odd unauthorized-reproduction">
            <div class="page-content">
                <h2>Unauthorized Reproduction</h2>
            </div>
        </div>

    </div><!-- #primary -->

</div><!-- #content -->

这是jQuery：

<script type="text/javascript">
    $(document).ready( function() {
        $('#nav-works-screen a').smoothScroll();

        $(document).scroll( function(){
            $('nav a').each( function(){
                var workLink = $(this);
                var work = workLink.attr('href');

                if (work != '') {

                    var workTop = $(work).offset().top;
                    var currentPos = $(window).scrollTop();
                    var winHeight = $(window).height();

                    if (currentPos >= workTop) {
                        workLink.css({'background-color':'#38FF4F'});
                        workLink.parent().siblings().children().css({'background-color':'transparent'});
                    }
                    else {
                        workLink.css({'background-color':'transparent'});
                    }
                }
            });
        });
    });
</script>

不幸的是，我一直收到一个错误，即无法读取null的属性“top”。如果我明确声明应该忽略任何空的工作变量，我不明白为什么工作变量是空的。我确信它的东西非常简单，但我现在已经用这个东西撞墙了一个多小时了。任何帮助将不胜感激。

编辑 - 这是问题所在：<li><a href="<?php randLink() ?>">Link???</a></li>我想我的随机链接php函数正在使用jQuery遍历DOM，但我很好奇为什么。

Answer 1

那实际上对我有用，但我不得不改变选择器

$('nav a').each( function(){

到

$('#nav-other-links a').each( function(){

因为html提取中没有“nav”元素。但是你应该放置一个

alert(work);

在if语句之前，检查空的href时的“工作”是什么，当它不是空字符串时。

Answer 2

    $(document).scroll( function(){
        $('nav a').each( function(){
             // if the href evaluates to false then return false
             if(!$(this).attr('href')){return false;}

Answer 3

您是否尝试过 attr not 选择器？

$('#nav-other-links a[href!=""').each(function() {
    //
});

此外，Tomasz对假想的NAV选择器是正确的。

在jQuery中忽略每个空的href

3 个答案: