1

我正在使用http://www.bulgaria-web-developers.com/projects/javascript/selectbox/更改选择框。

这是一个例子：http: //jsfiddle.net/ukkpower/bczrc/1/

我有一个按钮，单击时会在其下方的“a”标签内获取文本。我有两种类型的“a”。一个是页面加载代码的一部分，另一个是使用选择框插件动态创建的。

我可以从作为页面一部分的“a”标签中获取文本，但动态标签中我得到的是空字符串。我可以在屏幕上看到文本，并且当我使用 firebug 进行检查时，文本就在那里。

为什么$(this).next(".menuItem").text()不能使用动态的？我应该看到：14' - €14.14

 //button to get text
<a href="javascript:void(0)" class="addToCart cart"></a>

<div id="sbHolder_51608882" class="sbHolder" tabindex="1">
    <a id="sbToggle_51608882" href="#" class="sbToggle"></a>
    <a id="sbSelector_51608882" href="#" class="sbSelector menuItem">14' - €14.14</a>
         <ul id="sbOptions_51608882" class="sbOptions" style="display: none;">
              <li><a href="#1" rel="1">6' - €6.66</a></li>
              <li><a href="#2" rel="2">12' - €12.12</a></li>
              <li><a href="#3" rel="3" class="sbFocus">14' - €14.14</a></li>
         </ul>
</div>

这工作正常，是加载页面的一部分：

<a href="javascript:void(0)" class="addToCart cart"></a>
<span class="price menuItem">12' - €12.99</span>
4

1 回答 1

1

你的期望是不正确的。.next()获取紧邻的下一个元素（兄弟）。查看您的 HTML，您会看到以下内容的同级：

<a href="javascript:void(0)" class="addToCart cart"></a>

是 ：

<div id="sbHolder_51608882" class="sbHolder" tabindex="1">

如果你想使用在里面的类来访问锚点，.menuItem你需要进入里面。divdivfind

$(this).next("div.sbHolder").find("a.menuItem").text();

演示- 显示值来自.menuItem

编辑
要解决您拥有的两种不同场景，您可以应用一些逻辑。如果您总是有一种或另一种情况，则此特定逻辑将起作用。当然，如果您有完全随机的不可预测的场景，这将行不通。

$(".addToCart").on("click", function() {
    var $menuItem = $(this).next(".menuItem");

    if($menuItem[0] === undefined){
        $menuItem = $(this).next().find(".menuItem");
    }
    alert($menuItem.text());
});​

DEMO - 立即查找下一个或.menuItem子级.menuItem

于 2012-08-24T20:57:17.357 回答