Razor视图引擎中的Javascript

我有以下javascript：

<script type="text/javascript">
    function doReveal() {
        if (@Model.C1 == true) {
            document.getElementById('A1').style.backgroundColor = 'yellow';
        }
        if (@Model.C1 == false) {
            document.getElementById('A1').style.backgroundColor = 'yellow';
        }
</script>

我更改了它并删除了==true，但它仍然不起作用。即使下面的方法也不起作用。然而，如果我去掉“if（True）”，只设置颜色，它就会起作用

if (True) document.getElementById('A1').style.backgroundColor = 'yellow';

---

有人知道什么地方可能出错吗？

razor代码起始符号必须在if语句前面。否则，引擎认为if是javascript代码的一部分，而不是razor代码。我想你也需要

函数doReveal（）{
@如果（Model.C1==true）{
document.getElementById（'A1'）.style.backgroundColor='yellow'；
}
@如果（Model.C1==false）{
document.getElementById（'A1'）.style.backgroundColor='yellow'；
}

另一种情况是，您希望在javascript中而不是服务器端运行if语句

    <script type="text/javascript">

    function doReveal() {

        if (False == true) {

            document.getElementById('A1').style.backgroundColor = 'yellow';

        }

        if (False == false) {

            document.getElementById('A1').style.backgroundColor = 'yellow';

        }

</script>

函数doReveal（）{
if（False==true）{
document.getElementById（'A1'）.style.backgroundColor='yellow'；
}
if（False==False）{
document.getElementById（'A1'）.style.backgroundColor='yellow'；
}

---

False不等于true，也不等于False。（javascript区分大小写）。与True的情况相同。因此，您的if语句将不会执行。

重要的是要认识到，这样做不会使您的页面动态更改背景颜色以响应模型值的更改，因为ASP.NET在构建页面期间在服务器上运行，而JavaScript在创建页面后在浏览器上运行构建并下载

考虑到这一点，如果您只想更改页面加载时显示的背景颜色，以下可能是更好的选择：

@if (Model.C1) {
    <div id="A1" style="background-color: yellow;"></div>
} else {
    <div id="A1" style="background-color: blue;"></div>
}

@if（型号C1）{
}否则{
}

你知道javascript是在运行服务器端的Razor和ASP/MVC之后运行客户端的吗？一般来说，在你的C代码中写入

==true

和

==false

是新手的标志，所以不要这样做：）在C中，

if（SomeBoolVar==true）

可以写成

if（SomeBoolVar）

和

if（SomeBoolVar==false）

可以写成

if（！SomeBoolVar）

。如果布尔变量通过前缀

is

，

has

等正确命名，则后面的变量的字符数更少，可读性更高。如果C1为真或假，您知道您也在做同样的事情吗？加上一个文本标记提示。哇，现在的生活更轻松了！

    <script type="text/javascript">

    function doReveal() {

        if (False == true) {

            document.getElementById('A1').style.backgroundColor = 'yellow';

        }

        if (False == false) {

            document.getElementById('A1').style.backgroundColor = 'yellow';

        }

</script>

@if (Model.C1) {
    <div id="A1" style="background-color: yellow;"></div>
} else {
    <div id="A1" style="background-color: blue;"></div>
}