通过jQuery.html（）时ASP页面链接不可用

Question

作为一种业余爱好，我正在学习一些基本的ASP.net开发。我正在使用jQuery.html（）来更新一个div，该div具有指向ASP剃须刀页面的链接列表，但是这些链接不会通过。

我已经创建了一个测试Web应用程序，并附加了jQuery函数。代码有效，div填充，但是ASP页面链接未激活。我还没有找到关于此的任何具体信息，但是由于我是新手，因此我的Google-Fu可能已关闭。

这是在site.js中运行的jQuery代码：

$(document).ready(function () {

    $("#testDiv").html(
        '<p>Page List:</p> <ul> <li> <a asp-area="" asp-page="/TestPage">TestPage</a></li></ul>'
    );

});

运行此命令时，div如下所示：

当我将js查询中带引号的html代码直接复制到页面div中时：

<div class="row">
    <div id="testDiv">
        <p>Page List:</p> <ul> <li> <a asp-area="" asp-page="/TestPage">TestPage</a></li></ul>
    </div>
</div>

链接可以正常工作，如下所示：

除了ASP传递代码之外，我还需要做些其他事情来使链接与jQuery一起工作吗？

Answer 1

正如ADyson在评论中提到的那样，asp-page属性是Anchor Tag Helper，由Razor引擎呈现为适当的HTML。这是在服务器端发生的。

您通过jQuery执行的操作正在客户端进行。也就是说，没有可用的Razor引擎，因此它按原样呈现。一天结束时，剃须刀锚标签帮助器会将其值转换为有效的HTML。

在jQuery中，您必须为链接设置适当的HTML：

$(document).ready(function () {

    $("#testDiv").html(
        '<p>Page List:</p> <ul> <li> <a href="/TestPage">TestPage</a></li></ul>'
    );

});