Question

必须使用

嵌入javascript代码块

<script type='text/javascript'>
  ...
</script>

但是Razor代码不会编译在.js文件中的.cshtml文件中。

如何使这项工作？还是有其他优雅的方式来产生类似的效果吗？

谢谢。

Answer 1

当我遇到这个问题时，有时我会在.csh文件中提供的.js文件中提供一个函数...

// someFile.js
var myFunction = function(options){
    // do stuff with options
};

// razorFile.cshtml
<script>
    window.myFunction = new myFunction(@model.Stuff);
    // If you need a whole model serialized then use...
    window.myFunction = new myFunction(@Html.Raw(Json.Encode(model)));
</script>

不一定是最好的选择，但如果你必须这样做就行了......

您可能尝试的另一件事是在您的html元素上使用数据属性，例如jQuery.validate.unobtrusive如何...

//someFile.js
var options = $("#stuff").data('stuff');

// razorFile.cshtml
<input type="hidden" id="stuff" data-stuff="@model.Stuff" />

Answer 2

这是一个示例Razor网页（不是MVC视图，虽然它会类似），它将提供Javascript。当然，动态编写Javascript文件是非典型的，但这里仍然是一个示例。在我希望提供JSON数据和其他一些计算费用很少并且很少更改的东西的情况下，我曾经使用过一次 - 所以浏览器可以包含它并像普通的JS文件一样缓存它。这里的诀窍就是设置Response.ContentType，然后为您的Javascript使用类似Razor <text>标签的内容。

@{
Response.ContentType = "text/javascript";
Response.Cache.SetLastModified(System.Diagnostics.Process.GetCurrentProcess().StartTime);
Response.Cache.SetExpires(System.DateTime.Now.Date.AddHours(28));
Response.Cache.SetCacheability(System.Web.HttpCacheability.Public);
<text>
var someJavaScriptData = @someSortOfObjectConvertedToJSON;
function something(whatever){
}
</text>
}

然后您可以将其包含在您的其他Razor文件中：

<script src="MyRazorJavascriptFile.cshtml"></script>

Answer 3

你做不到。你甚至不应该尝试。将它们分开。反过来说，你应该考虑Unobtrusive JavaScript。在整个项目中应用的设计模式是一个好主意。

Answer 4

虽然我同意你应该三思而后行在你的Javascript文件中使用Razor，但是有一个可以帮助你的Nuget包。它被称为RazorJS。

该软件包的作者有一个blog post，它解释了如何使用它。

Answer 5

也许我可以提供有用的解决方法，具体取决于你想要完成的任务。

我很想找到一种方法来评估java脚本文件中的剃刀表达式。我想附加一个jQuery单击事件处理程序来提交在许多页面上找到的特定类。这应该在jQuery文档就绪事件处理程序中完成。此单击事件将执行ajax调用。

如果应用程序位于根级别以下，则这些URL应该是应用程序相对的，而不是绝对的。所以，我想使用像

这样的东西

$(document).ready(function () {
    $('input[type="submit"].checkit)').click(function (e) {
        $.ajax({
            type: 'POST',
            url: '@Url.Content("~/checkit")', //Razor expression here
            dataType: 'json',
            success: function (data) {
                if (!data) {
                    e.preventDefault();
                    handleResponse(data);
                }
            },
            data: null,
            async: false
        });
    });
});

我通过将代码包装在函数Checkit中并将调用移动到布局视图来解决这个问题：

        $(document).ready(function () {
            Checkit('@Url.Content("~/checkit")');
        });

大多数javascript代码仍在javascript文件中。

Answer 6

那包括一个只包含js的.cshtml呢？

.csthml parent

@RenderPage("_scripts.cshtml")

包含js的_scripts.cshtml

<script type="text/javascript">
alert('@Datetime.ToString()');
</script>

如何在.js文件中嵌入Razor C＃代码？

6 个答案: