jQuery引用使用局部视图生成的div来附加另一个局部视图

我在一个页面上多次呈现此局部视图：

@model POS.Domain.Entities.Category

<div class = "category" id= "@Model.Name">
    <h2>@Model.Name</h2>
    <a href='javascript:getView();'>Get Partial View</a>
    <script type="text/javascript">
        function getView() {
            $('#divResult').load("@Url.Action("ProductList" , "Product", new {category = Model.Name})");
        }
    </script>
    <div id="divResult">
    </div>
</div>

如果我手动将

Balls

的值传递给

categoryName

，我可以从

Balls

类别接收产品，但如果我使用

var categoryName=$（this）.closest（.category”）.attr（“id”）我得到
未定义的

查看HTML可能会有所帮助？
您可以使用load函数的第二个参数随load请求一起传递数据。检查

将getView函数更改为如下所示：

function getView(e) {
  e.preventDefault();
    var $category = $(this).closest(".category");
  var categoryName = $category.attr("id");
   $('.divResult', $category).load("@Url.Action("ProductList" , "Product")", {
     category: categoryName
    });
}

更新：
同一ID不能用于页面上的多个元素。由于您正在多次加载部分视图并进行追加，因此将以具有相同ID的多个元素结束。将部分视图更改为如下（使用类而不是ID）：

@model POS.Domain.Entities.Category
@型号.名称

并将getView函数移动到父视图：

<script type="text/javascript">
        function getView() {
                var categoryName = $(this).closest(".category").attr("#id");
                $('.divResult').load("/Product/ProductList",
                        {category: categoryName});
        }

        $(function(){
            $(".category").on("click", "a", getView);
        });
</script>


函数getView（）{
var categoryName=$（this）.closest（“.category”）.attr（“#id”）；
$（'.divResult'）.load（“/Product/ProductList”，
{类别：categoryName}）；
}
$（函数（）{
美元（“.category”）。在（“单击”、“a”，获取视图）；
});
两个问题：首先，这似乎没有适当地将我的
类别
信息发送到我的操作。其次，当我从检索到的PartialView中附加信息而忽略
类别
信息时，它会以与原始代码相同的方式进行附加-只有最顶端的div会得到任何内容，即使我单击在不同div中呈现的链接也是如此。嗯。我认为加载函数实现没有任何问题。如果类别名称被正确分配为id，那么应该正确地传递它。另外，当您说“即使我单击了在不同div中呈现的链接，也只有最顶层的div才能获取任何内容”时，您指的是什么？
categoryName
传递的值为“undefined”，尽管如果我手动将该值设置为与父div ID匹配，则一切正常。---关于第二部分。这（OP中的代码块）都是在一个页面上多次加载的部分视图的一部分。每当我从这些ajax请求中获得成功调用时，附加的数据只附加到屏幕上的第一个
partialView
，而不是我在中单击链接的实际
partialView
。@miscusermandude My bad。我错过了最近的方法调用中的
。关于在一个页面上多次加载部分视图，您不能对多个元素使用相同的id。稍后将发布一个带有小改动的答案。我们正在取得进展。我仍然返回未定义的
categoryName
，现在部分视图在页面上的每个id处加载（因为部分视图是重复的），因此我似乎需要返回按id命名，但将id重命名为每个部分的自定义名称（如
divResult+@Model.Name
）您在最后一部分中没有正确引用id，它应该是
.attr（“id”）
@model POS.Domain.Entities.Category

<div class = "category" id= "@Model.Name">
    <h2>@Model.Name</h2>
    <a href='/get-partial-view'>Get Partial View</a>
    <div class="divResult">
    </div>
</div>

<script type="text/javascript">
        function getView() {
                var categoryName = $(this).closest(".category").attr("#id");
                $('.divResult').load("/Product/ProductList",
                        {category: categoryName});
        }

        $(function(){
            $(".category").on("click", "a", getView);
        });
</script>