Javascript Link 到 Asp 核心操作

Javascript Link to AspCore Action

我想传递一个 Javascript 创建的字符串作为 aspcore 中的路由数据。该字符串是从 Javascript 数组创建的,如下所示:

<body>
    FULL LIST: <span id="Inventory"></span>
</body>    
<script>
var FullString = LargeList.concat(SmallList);
    LenB = BoxList.length;
    FullString.push(LenB);

    document.getElementById("Inventory").innerHTML = FullString.join("/");
</script>

我想我可以再次使用 Javascript 来创建 link,但这似乎不是正确的想法。

<body>
    <input type="button" onclick="AddToFiv()" value="Create A 5/I Remark" />
    <p id="FivRemarkLink"></p>
</body>
<script>
    function AddToFiv() {

    var FullString = LargeList.concat(SmallList);
    LenB = BoxList.length;
    FullString.push(LenB);

    var Inventory = FullString.join("/");

    var text = "<a asp-action="FivCreate" asp-route-zero="@ViewBag.zero" asp-route-code="I" asp-route-priority="5" asp-route-remark=" + Inventory + ">ADD 5/I</a>";

    document.getElementById("FivRemarkLink").value = text;
}
</script>

首先,asp-xxx在js中无法识别,所以可以使用href,然后如果要将<a></a>添加到<p id="FivRemarkLink"></p>,你可以这样使用 document.getElementById("FivRemarkLink").innerHTML = text;.

这是一个假数据演示(ViewBag.zero="zero"):

<input type="button" onclick="AddToFiv()" value="Create A 5/I Remark" />
<p id="FivRemarkLink"></p>
<script>

    //$(function () {

    //    const LargeList = ['a', 'b', 'c'];
    //    const SmallList = ['d', 'e', 'f'];
    //    const BoxList = ['g', 'h', 'i'];
    //    var FullString = LargeList.concat(SmallList);
    //    LenB = BoxList.length;
    //    FullString.push(LenB);

    //    document.getElementById("Inventory").innerHTML = FullString.join("/");
    //})
     function AddToFiv() {
         const LargeList = ['a', 'b', 'c'];
         const SmallList = ['d', 'e', 'f'];
         const BoxList = ['g', 'h', 'i'];
    var FullString = LargeList.concat(SmallList);
    LenB = BoxList.length;
    FullString.push(LenB);

    var Inventory = FullString.join("/");
         var text = "<a href='FivCreate?zero=@ViewBag.zero&code=I&priority=5&remark="+Inventory+"'>ADD 5/I</a>";
         document.getElementById("FivRemarkLink").innerHTML = text;
     }
    </script>

结果: