jQuery：nth-​​child选择器抛出“undefined”并崩溃网站

Question

$('#mapid').val($(".firstbox ul li:nth-child(" + mapi + ")").class());返回一个无限循环的未定义错误......

我甚至尝试过：$('#mapid').val($(".firstbox ul li:nth-child(2)").class());并发生同样的错误。

这些元素无疑存在，脚本位于页面底部。不，我不使用Wordpress（我看到这是关于错误的常见主题）。

这是HTML：

<div id="map-box" class="firstbox">
        <ul>
                        <li class="14" id="thelimit">
                <div class="left">
                    <h1>The Limit</h1>
                    <span class="inf">A branching map. A mix-n match of alot of themes into one map.                    <p>Recommended Players: 3<br />
                    Author: <a href="http://www.minecraftforum.net/user/18586-timetoslide/" target="_new">timetoslide</a></p></span>
                </div>

                <div class="right" style="position: relative">
                    <div style="width: 250px; height: 120; z-index: 6; position: absolute; top: 0px; height: 120px; left: 35px; cursor: pointer" class="righthover"></div>
                    <div style="background: url('maps/thelimit.jpg'); width:250px;height:150px;overfow:hidden;border:none;position: relative; z-index: 1">
                    <div style="background: url('img/vignette.png') no-repeat center center; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 2"></div>
                        <div class="seeList" style="width: 100%; height: 100%; background: url(img/cbg.png) repeat; color: white; font-family: Georgia, 'Times New Roman'; font-size: 24px; margin: 0; padding: 0; font-style: italic; text-align: center; z-index: 1; display: none;"><div style="padding: 20px; padding-top: 40px;">See full list of maps...</div></div>
                        <img src="img/border.png" style="z-index: 3" />
                        <div class="directions" style="z-index: 5"></div>
                    </div>
                </div>
            </li>
                    <li class="13" id="lavaseaofsurvival">
                <div class="left">
                    <h1>Lava Sea of Survival</h1>
                    <span class="inf">Try to survive by using only the resources provided. Did we mention you're floating above lava?                    <p>Recommended Players: 4<br />
                    Author: <a href="http://www.minecraftforum.net/user/1021295-meh-own/" target="_new">Meh_Own</a></p></span>
                </div>

                <div class="right" style="position: relative">
                    <div style="width: 250px; height: 120; z-index: 6; position: absolute; top: 0px; height: 120px; left: 35px; cursor: pointer" class="righthover"></div>
                    <div style="background: url('maps/lavaseaofsurvival.jpg'); width:250px;height:150px;overfow:hidden;border:none;position: relative; z-index: 1">
                    <div style="background: url('img/vignette.png') no-repeat center center; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 2"></div>
                        <div class="seeList" style="width: 100%; height: 100%; background: url(img/cbg.png) repeat; color: white; font-family: Georgia, 'Times New Roman'; font-size: 24px; margin: 0; padding: 0; font-style: italic; text-align: center; z-index: 1; display: none;"><div style="padding: 20px; padding-top: 40px;">See full list of maps...</div></div>
                        <img src="img/border.png" style="z-index: 3" />
                        <div class="directions" style="z-index: 5"></div>
                    </div>
                </div>
            </li>
[etc...]

Answer 1

您的代码中可能有多个元素包含class = firstbox，其中一些元素可能没有您尝试访问的元素。

在你的情况下，你可以尝试使用child（）函数来引用具有id map-box的元素的子元素，这可以解决你的问题。

http://api.jquery.com/children/