代码<text>不再执行

Question

我的现有代码在jquery 1.10.2之前运行良好。我试过在调试模式下运行，似乎没有达到<text>中的代码。到达了CalculteMyAgeOne，而从未到达过calcultemyagetwo。我在视图中有以下代码。为什么它不再执行<text>中的代码了?

注意:我已经添加了AddRows函数，AddRows函数在调试模式下达到，但是，对于CalculateMyAgeTwo

来说，情况并非如此

<script type="text/javascript">
    $(function () {
        CalculateMyAgeOne();
@if (Mode)
{    
        <text>
            CalculateMyAgeTwo();
            AddRows(@(5 - Model.Rows.Length));      
        </text>
 }
    });
    function CalculateMyAgeOne() {
        $("#table tbody tr:last").hide();
    }
    @if (Mode){ //Note that Mode is true
    <text>
        function CalculateMyAgeTwo() {
        }
        function AddRows(rowsToAdd){
        }
    </text>
    }

Answer 1

既然你已经标记了ASP MVC，我想澄清一下，<text>元素是一个特殊的Razor元素(Razor是一个具有自己语法的ASP MVC视图引擎)，这与JavaScript或HTML无关。从这篇介绍ASP MVC中Razor语法的优秀文章中:

标签是Razor特别处理的元素。它导致Razor将块的内部内容解释为内容，而不呈现包含标签元素的含义只有元素的内部内容才会被呈现标签本身不会)。这样当你想要的时候就很方便了呈现未被HTML包装的多行内容块

元素。

要使其工作，<text>元素必须在Razor代码块中。否则，它将按照生成的HTML呈现(在您的情况下会导致语法错误)。

假设这个脚本元素在Razor视图中，下面的代码:

<script type="text/javascript">
    $(function () {
        CalculateMyAgeOne();
        <text>
            CalculateMyAgeTwo();        
        </text>
    });
    function CalculateMyAgeOne() {
        alert("CalculateMyAgeOne");
    }
    function CalculateMyAgeTwo() {
        alert("CalculateMyAgeTwo");
    }
</script>

将完全按照发送到浏览器的HTML呈现，并且您将得到其他人已经指出的语法错误。(基本上不会看到任何警告)。

但是，如果你在Razor视图的代码块中有<text>元素，如下例所示:

<script type="text/javascript">
    $(function () {
        CalculateMyAgeOne();
        @if ( true /* some meaningful condition in real code */ ) { 
            <text>
            CalculateMyAgeTwo();        
            </text>
        }
    });
    function CalculateMyAgeOne() {
        alert("CalculateMyAgeOne");
    }
    function CalculateMyAgeTwo() {
        alert("CalculateMyAgeTwo");
    }
</script>

当条件为真时，这将呈现生成的HTML:

<script type="text/javascript">
    $(function () {
        CalculateMyAgeOne();
            CalculateMyAgeTwo();
    });
    function CalculateMyAgeOne() {
        alert("CalculateMyAgeOne");
    }
    function CalculateMyAgeTwo() {
        alert("CalculateMyAgeTwo");
    }
</script>

如果条件为false，则不会呈现对CalculateMyAgeTwo的调用。如果你在最后一个例子中删除了<text>元素，Razor会认为CalculateMyAgeTwo是服务器端c#代码的一部分，你会得到一个服务器端渲染视图错误。

希望有帮助!

Answer 2

这是javascript中的语法错误。JS代码中不能有HTML元素(比如<text>)。
这基本上是行不通的。删除<text>标签，你的JS将再次工作。

Answer 3

文本标签需要一个示例中缺少的razor上下文或条件。

使用Mode = true时，以下更新后的示例是可以的，并且达到了

@{
    var Mode = true;
}
<script type="text/javascript">
    $(function () {
        CalculateMyAgeOne();
        @if (Mode)
        {
            <text>
            CalculateMyAgeTwo();
            </text>
        }
    });
    @if (Mode)
    {
         <text>
        function CalculateMyAgeOne() {
            alert("one");
        }
        function CalculateMyAgeTwo() {
            alert("two");
        }
        </text>
    }
</script>