Question

当我将部分视图中的html数据转换为$（数据）时，它不会返回我希望的jQuery对象：

console.log($(data)) - ＆gt; [#document]

相反，它会返回：

console.log($(data)) - ＆gt; [#text, <meta charset="utf-8">, #text, <meta name="viewport" content="width=device-width">, #text, <title></title>, #text, <link href="/css?v=EY1fW53lN3Ow8WxEYembf-Ji7ogVpt21gpjVWDy8x6c1" rel="stylesheet">, #text, <div>default</div>, #text, <div id="test-div">default</div>, #text, <script src="/jsv=k_VAvcysGBhwGVVEK9GAtPakb2vjMfaxz2PhpxPuN0I1"></script>, #text ]

当我对数据执行原始控制台日志时，它会返回：

console.log(data) - ＆gt;

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title></title>
    <link href="/css?v=EY1fW53lN3Ow8WxEYembf-Ji7ogVpt21gpjVWDy8x6c1" rel="stylesheet"/>

</head>
<body>


        <div>default</div>
        <div id="test-div">default</div>

    <script src="/js?v=k_VAvcysGBhwGVVEK9GAtPakb2vjMfaxz2PhpxPuN0I1"></script>

</body>
</html>

问题1：如何从此数据中提取#test-div？

更新1

这是我的控制器：

public ActionResult Index(string pageName, string categorySlug, string itemSlug)
        {

            if (categorySlug != null)
            {
                var category = _db.Categories.SingleOrDefault(x => x.Slug == categorySlug);
                if (category == null) return Redirect("/");
                ViewBag.Category = category;

                if (itemSlug != null && category.Items.SingleOrDefault(x => x.Slug == itemSlug) != null)
                {
                    ViewBag.ItemSlug = itemSlug;
                }
                else if (itemSlug != null)
                {
                    return Redirect("/i/" + categorySlug);
                }
            }

            ViewBag.PageName = pageName;
            return View();
        }

这是我的路线：

routes.MapRoute(
                name: "Default",
                url: "{pageName}/{categorySlug}/{itemSlug}",
                defaults: new { controller = "Home", action = "Index", pageName = UrlParameter.Optional, categorySlug = UrlParameter.Optional, itemSlug = UrlParameter.Optional },
                namespaces: new string[] { "ClothRent.Controllers" }
            );

索引视图：

@{
    ViewBag.Title = "";
    Layout = "~/Views/Shared/_Layout.cshtml";
    string pageName = ViewBag.PageName;

    ClothRent.Models.Category c = ViewBag.Category;
}
@switch (pageName)
{
    case "info":
        Html.RenderPartial("_Info");
        break;
    case "i":
        Html.RenderPartial("_Category", c);
        break;
    default:
        <div>default</div>
        <div id="test-div">default</div>
        break;
}

_Category局部视图：

@model ClothRent.Models.Category
@{
    string zveri = "zveri";
    string teli = "teli";
}
@switch (Model.Slug)
{
    case "zveri":
        @zveri
        break;
    case "pasaku-teli":
        @Html.Partial("_Teli", Model);
        break;

}

它是如何运作的：

我访问了网址/i/category/并返回/home/index并提供了适当的部分视图数据，请参阅我如何获取上面的部分视图。
然后，如果用户希望他继续浏览网站，但不是重新加载页面，我想做htmlPushState，我将对特定的控制者进行ajax调用，并将提取我将要显示的下一个内容所需的数据。

更新2

问题2：有没有办法只使用JavaScript从ajax调用渲染返回的数据，这样我就不需要为ajax调用专门编写API了？

更新3

感谢大家的答案我将来肯定会为独家的ajax调用制作api，但是由于我不掌握我网站的后端，我找到了一个使用JS的解决方案。

Posted Answer.

Answer 1

感谢Dave A使用此语法解决了问题。

$("#container").load("/i/category/ #test-div")

Answer 2

我想我明白了。由div test-div选择器过滤的负载是否可以满足您的要求？

$("#container").load('/i/category/').('#test-div');

ajax数据不会返回正确的jQuery html对象

更新1

更新2

更新3

2 个答案: