jquery - 这段 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)时，您正在创建一个 jQuery 对象，其中包含两个 <div>元素。

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

您可以调用 .filter() ，它搜索集合中的元素(但不搜索其后代)。

或者，您可以将返回的 HTML 包装在新的 <div> 中。标签，然后调用.find() 。因为您的元素将成为包装器 <div> 的子元素，可以通过 .find() 找到它们.
不像 .filter() ，如果服务器更改为返回 <div>，这仍然有效。你小时候正在寻找。