Question

只是想知道是否有人知道一个像样的jQuery插件（或Javascript），这将允许我加载＆＃34;查看＆＃34;当用户点击链接时，（非部分视图）进入<div>。

这里可能很棘手，我有8页。我有一个主页，有3个部门。 Header的第一个分区和第二个分区有图片，第三个分区为页脚。我想将视图加载到第二个分区。我一直在搜索谷歌，但却找不到任何看似稳定的东西。

先谢谢Shiyas：）

我试过下面的代码。它无法正常工作。

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">

        $("#a_book_id").click(function () {
            $("#middleDiv").load("http://localhost:56708/Home/Books");
            });
    </script> 

</head>
<body>
    <div id="mainDiv">
     <div id="headerDiv">
        @Html.Partial("~/Views/Shared/Header.cshtml")
     </div>
    <div id="middleDiv">        

    </div>
    <div id="footerDiv">
        @Html.Partial("~/Views/Shared/Footer.cshtml")
    </div>
        </div>
</body>

此代码来自我的主页。在这里，我将Header（部分视图）渲染到第一个分区。当我点击标题中的链接时，书籍视图应该加载到中间分区。好吧，它没有加载。

Answer 1

您可以使用jquery load功能。

从服务器加载数据并将返回的HTML放入匹配的元素中。

$('#divId').load('url');

jQuery .load() documentation

Answer 2

在</body>之前放置加载视图的脚本片段在页面底部。您还应该使用相对URL，因此当您发布到生产时，您不必更改它。试试下面的内容。

<body>
<div id="mainDiv">
     <div id="headerDiv">
        @Html.Partial("~/Views/Shared/Header.cshtml")
     </div>
    <div id="middleDiv">        

    </div>
    <div id="footerDiv">
        @Html.Partial("~/Views/Shared/Footer.cshtml")
    </div>
 </div>
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">
        $("#a_book_id").click(function () {
            $("#middleDiv").load("/Home/Books");
         });
    </script> 
</body>

将视图加载到<div>中

我试过下面的代码。它无法正常工作。

2 个答案: