将静态javascript函数转换为动态函数

Convert a static javascript function to dynamic

本文关键字：函数 动态 转换 javascript 静态      更新时间：2023-09-26

在一个c# MVC项目中，前端设计师给了我一个视图，其中包含了这个小脚本:

 <script>
    $('#PhaseDD').change(function () {
        var chosenValue = $(this).val();
        $('.ProcessDD').hide();
        if (chosenValue == "")
            $('#DefaultProcess').show();
        if (chosenValue == "Planning")
            $('#PlanningProcess').show();
        if (chosenValue == "Procurement")
            $('#ProcurementProcess').show();
        if (chosenValue == "Installation")
            $('#InstallationProcess').show();
        if (chosenValue == "Closure")
            $('#ClosureProcess').show();
    });
</script>

我想用来自模型的列表替换所有硬编码的选项。像这样…

<script>
    $('#PhaseDD').change(function () {
        var chosenValue = $(this).val();
        $('.ProcessDD').hide();
        if (chosenValue == "")
            $('#DefaultProcess').show();
        // loop over a list from the model here
        if (chosenValue == " loop-item-name ")
            $('# loop-item-name + Process').show();
       //  end loop
    });
</script>

这可能吗?如果有，怎么做?我这样做对吗?我想我可以使用razor语法，但这是不工作

你不能比较c#变量和JS变量。但是你可以用razor从c#变量中创建一个JS变量。

下面是如何用c#数组的值来填充JS数组: 
@{ 
   // fetch this from ViewModel if it needs to be dynamic
   var cSharpNames = new [] { "Planning", "Procurement"}; 
 }
<script>
    var jsNames = []; // this is a JS array
    @foreach(var name in cSharpNames) {
         <text>jsNames.push(@name);</text>
    }
</script>

然后使用indexOf()方法在jsNames数组中搜索，如Jeremy所示。

我将创建一个数组，检查该值是否存在于其中，以及它是否显示它。像这样:

<script>
    $('#PhaseDD').change(function () {
        var chosenValue = $(this).val();
        var processes = ['Planning', 'Procurement'];
        $('.ProcessDD').hide();
        if (chosenValue == "")
            $('#DefaultProcess').show();
        if (processes.indexOf(chosenValue) > -1)
            $('#' + chosenValue + 'Process').show();
    });
</script>

我想太多了。

    $('#PhaseDD').change(function () {
        var chosenValue = $(this).val();
        $('.ProcessDD').hide();
        if (chosenValue == "")
        {
            $('#DefaultProcess').show();
        }
        else
        {
            $('#' + chosenValue + 'Process').show();
        }
    });
相关文章：