2

只是一个小例子。我有 3 个链接、一个按钮和一个 div：

<a href="#">AAA</a>
<a href="#">BBB</a>
<a href="#">CCC</a>
<button id="getResult">Get result</button>
<div id="result"></div>

现在，当按下按钮时，我想从 3 个链接中获取文本并将它们插入到结果 div 中。这是我的代码：

<script type="text/javascript">
    $(function() {
        $('#getResult').click(function() {
            var links = $('a');
            $.each(links, function() {
                $('#result').append('<p>' + links.html() + '</p>');
            });
        }); // end click
    }); // end ready
</script>

我希望结果是

AAA
BBB
CCC

但它是

AAA
AAA
AAA

有谁知道为什么以及如何解决这个问题？如果你有更好的方法来做到这一点，你能告诉我吗？我对 jQuery 很陌生。感谢您的帮助。

4

4 回答 4

5

在您.each调用的函数内部，它只获取集合中第一个元素links.html()的 html 。你的意思是使用（可能）。$(this).html()

http://jsfiddle.net/ExplosionPIlls/xZymh/

顺便说一句，您可以将其重写为仅使用.html方法本身进行附加：

$("a").html(function (_, html) {
    $("#result").append("<p>" + html + "</p>");
});

http://jsfiddle.net/ExplosionPIlls/xZymh/1/

于 2013-04-15T16:24:44.207 回答
4

代替

        $.each(links, function() {
            $('#result').append('<p>' + links.html() + '</p>');

和

        links.each(function() {
            $('#result').append('<p>' + $(this).html() + '</p>');

或者干脆

$('a').each(function() {
     $('#result').append('<p>' + $(this).html() + '</p>');
});

您没有使用迭代项，您应该使用.each而不是$.each来迭代 jQuery 集合。

另一种更直接的解决方案是，仅导致 DOM 的一次更改（这通常是昂贵的操作）是：

$('#result').html(
  $('a').map(function(){return '<p>'+this.innerHTML+'</p>'}).get().join('')
);
于 2013-04-15T16:24:25.723 回答
1

当有疑问时，让事情变得简单。您可以在不需要 jQuery $.each 语句的情况下执行此操作。我不是 100%，但我认为它无论如何都被错误地使用了。

而不是 $.each 试试这个

for (var i = 0; i < links.length; i++){
   var linkHtml = links[i].html();
   $('#result').append('<p>' + linksHtml + '</p>');  
}

希望有帮助

于 2013-04-15T16:25:45.597 回答
0

试试这个，你需要迭代链接，所以使用 links.each 在这里查看小提琴http://jsfiddle.net/raQtf/

$(function() {
        $('#getResult').click(function() {
             var links = $('a');
            links.each(function(){
                $('#result').append('<p>' + $(this).html() + '</p>');
            });

        }); // end click
    }); // end ready
于 2013-04-15T16:26:16.070 回答