jQuery .text()显示双重文本

Question

发生了奇怪的情况.我有一个<h3>文本.当我用.text()提取这个文本然后把它放入一个<textarea>文本出现两次.

这是jsFiddle.

HTML

<h3 class="profileRightAboutMeText">Heya, this is all the text.</h3>     
<textarea class="profileRightAboutMeTextarea"></textarea>

JQUERY

$(document).on('click','h6.editMyProfileSection', function() {
  var originalText = $('h3.profileRightAboutMeText').text();

  $('h3.profileRightAboutMeText').fadeOut('fast', function() {
    $('textarea.profileRightAboutMeTextarea').text(originalText).fadeIn('fast');
  });
  alert(originalText);
});

警报和<textarea>显示文本双重如下:

Heya,这是所有的文字.Heya,这是所有的文字.

Answer 1

我会说你在页面上有两个匹配$('h3.profileRightAboutMeText')的元素.

你可以在这里看到:http://jsfiddle.net/KwcGB/文本出现两次,因为我在html中添加了额外的h3.profileRightAboutMeText,但是如果删除了额外的行,那么它只出现一次.

尝试将$('h3.profileRightAboutMeText')放入firebug中的控制台并查看它匹配的元素数量......

Answer 2

对于text()通过复合路径解决的重复项,JQuery具有不同的方法行为.

例如,让我们

<div id=b class="a">2</div>
<div id=b class="a">3</div>

然后

var val1 = $("#b").text()
var val2 = $("#b.a").text()

// val1 = 2
// val2 = 23

要避免此问题,请确保使用.first()

var val3 = $("#b.a").first().text()

// val3 = 2