Question

看看我的功能：

$(".select-default").on("click", function() {
    $(".dropdown-menu li a").on("click", function() {
      var x = $(".select-default label").children()[0];
      $(".select-default label").text($(this).text()+x);
    });
  $(this).off("click");
 });

我正在试图弄清楚为什么x打印未定义，我期望它打印实际的子节点：

<span class="caret"></span>

编辑。这是标记：

<ul class="select-default select-sm dropdown-toggle" data-toggle="dropdown">
<label for="select" id="select_value">Select Action <span class="caret"></span></label>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Value 0</a></li>
<li><a href="#">Value 1s</a></li>
<li><a href="#">Value 2</a></li>            
<li><a href="#">Value 3</a></li>

我正在尝试将整个span节点嵌套在label中，然后加入它使用单击标签的值。 x应该是打印：

<span class="caret"></span>

Answer 1

$(".select-default label").children()[0]将返回undefined，因为从label的外观来看，.children()将文本节点作为子节点。 $(".select-default label").text()不会选择元素的文本节点，而是可以使用label获取$(".select-default").on("click", function() { $(".dropdown-menu li a").on("click", function() { var a = $($(".select-default label").contents().get(0)); a.replaceWith($(this).text()) }); $(this).off("click"); });元素的文本

{{1}}

演示：Fiddle

Answer 2

答案很简单。

使用append（x）。替换：

$(".select-default label").text($(this).text()+x);

使用：

$(".select-default label").text($(this).text()).append(x);

非常感谢。

Answer 3

这可行：

  $(".dropdown-menu li a").on("click", function(e) {
      e.preventDefault();
      var $label = $(".select-default").children("label");
      $label.text($(this).text());          
  });

在这里工作小提琴：http://jsfiddle.net/uaqHg/2/

子值返回undefined

3 个答案: