如何在ASP的Jquery和Razor页面中增加和使用值。net core 2.0

我将尝试用两种不同的解决方案再现你的问题。我假设您有一个用于存储值的类:

public class Position
{
    public int top { get; set; }
    public int left { get; set; }
}

您将在PageModel中拥有一个属性,该属性将存储位置列表,并将值列表加载到此列表中

public class TestModel : PageModel
{
    public List<Position> Positions { get; set; }

    public void OnGet()
    {
        Positions = new List<Position>
        {
            new Position {left = 10, top = 20},
            new Position {left = 20, top = 30},
            new Position {left = 30, top = 40},
        };
    }
}

现在您有两个选择。第一个选项是用C#代码生成潜水,第二个选项是生成一个json对象,该对象将与javascript一起使用。

第一个解决方案

@foreach (var item in Model.Positions)
{
    <div style="left: @(item.top)px; top: @(item.top)px">
        contents of your div
    </div>
}

第二种解决方案

<script type="text/javascript">
    var data = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.Positions));
</script>

这将在razor页面中生成以下代码:

<script type="text/javascript">
    var data = [{"top":20,"left":10},{"top":30,"left":20},{"top":40,"left":30}];
</script>

现在,您可以使用数据对象来使用javascript设置顶部和左侧。

我希望这有帮助。