asp.net mvc -如何在Razor语法中使用JavaScript

asp.net mvc - How to use JavaScript inside Razor Syntax

本文关键字：语法 JavaScript Razor mvc net asp      更新时间：2023-09-26

我需要在我的Razor语法中使用JavaScript。这是我的JavaScript函数。我需要获得我的元素ID，并基于此，我尝试从我的模型的图像列表中获取Image URK。

<script>
    function pickThisPicture(element) {
        var id = element.id;
        document.getElementById("big-picture").src = "@Url.Content(Model.Images[id].Url)";
    }
</script>

如何将发送给函数的元素的ID放到模型中?图像对象?

我试过这样做，但都不起作用:

document.getElementById("big-picture").src = "@Url.Content(Model.Images[@:id].Url)";
document.getElementById("big-picture").src = "@Url.Content(Model.Images[<text>id</text>].Url)";

谢谢。

你不能做你想做的事。记住，在加载页面时，Razor代码在服务器上运行。在页面完成呈现后，在客户端加载Javascript。你不能简单地调用服务器代码，这取决于客户端代码的结果。

为了使用仅在运行时才知道的值进行服务器调用，必须使用某种AJAX调用。

一个建议可能是使用包含"bigger"图像URL的数据值生成元素，然后在页面侧函数中访问该值。

<image data-big-url='@Url.Content(Model.Images[id].Url' class='smallimages' />

这里的"id "将是列表元素的索引(服务器端)然后以某种方式访问它，比如jQuery它可能是:

$(document).ready(function(){
    $('.smallimages').on('click',function(){
        var big = $(this).data('big-url');
        document.getElementById("big-picture").src = big;
    });
});
相关文章：