这个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>您正在寻找的孩子,这仍然有效.