这个jQuery代码有什么问题？

Question

我的以下代码工作正常。

$(document).ready(function() {
        $('a.address').click(function() {
            $('#box').slideDown("slow");

            $.ajax({
            type: "POST",
              url: "details.php",
              success: function(html){              
                 $("#msg").html(html);
                } 
            });

        });
    });

但是以下没有（在成功内部只改变了1行:)，它没有加载任何东西..只滑动#box，而#msg里面，但是不加载#address。

$(document).ready(function() {
        $('a.address').click(function() {
            $('#box').slideDown("slow"); 

            $.ajax({
            type: "POST",
              url: "details.php",
              success: function(html){
                $("#msg").html($(html).find('#address').html());
                } 
            });

        });
    });

The details.php is:


<div id="info">some text.</div>
    <div id="address">The address</div>

Answer 1

当你编写$(html) ，你正在创建一个包含两个<div>元素的jQuery对象。

在此对象上调用.find(...)搜索<div>元素的后代 。
由于两个元素都没有任何子元素，我永远不会找到任何东西。

相反，你可以调用.filter()来搜索集合中的元素（但不是它们的后代）。

或者，您可以将返回的HTML包装在新的<div>标记中，然后调用.find() 。 由于您的元素将成为包装器<div>子元素，因此它们将由.find()找到。
不像.filter()这仍将如果服务器更改为返回工作<div>你正在寻找作为一个孩子。

Answer 2

jQuerys .load .load() ^帮助方法允许您加载和插入页面片段 ：

$('a.address').click(function() {
    $('#box').slideDown("slow"); 

    $('#msg').load('details.php #address');
});

这可能就是你想要在这里实现的目标。