Question

我需要在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放到Model.Images对象？

我尝试过类似的东西，但没有一个有效：

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

谢谢。

Answer 1

你无法做你正在尝试的事情。请记住，Razor代码在加载页面时在服务器上运行。页面完成渲染后，Javascript在客户端加载。您不能简单地调用服务器代码，这取决于客户端代码的结果。

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

Answer 2

一个建议可能是使用包含＆＃34;更大＆＃34;的URL的数据值生成您的元素。然后在页面端函数中访问该值。

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

＆＃34; id＆＃39;将有该列表元素的索引（服务器端），然后以某种方式访问它，例如jQuery可能是：

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

如何在Razor语法中使用JavaScript

2 个答案: