Question

我想在for循环中使javascript函数名称动态化

我就是这样

<script type="text/javascript">
  var divlabel = "";
  var classlabel = "";
     for(index=1; index <=5;index++ ){
     divlabel = 'ShowHideDiv_'+index;
     classlabel = 'class_type_id'+index;
    function divlabel(classlabel) { 
    }
}

和选择标签上的功能是

<?php
for($i=1; $i<=5; $++){
<select id="class_type_id<?= $i;?>" name="class_type_id[]" class="browser-default" onchange="ShowHideDiv_<?= $i;?>(this);">
</select>
}?>

问题是，当我更改选择选项时，此错误将显示在控制台窗口上未捕获的ReferenceError：未定义ShowHideDiv_3 所以我希望该功能在for循环内是动态的

Answer 1

对不起，但是没有您在这里所做的事情

  var divlabel = "";
  var classlabel = "";
     for(index=1; index <=5;index++ ){
     divlabel = 'ShowHideDiv_'+index;
     classlabel = 'class_type_id'+index;

  function divlabel(classlabel) {}

没有什么事情可以使用字符串来重命名您的命名函数，至少没有什么正常和明智的选择。如果有的话，在任何普通的JavaScript代码库中重命名顶级函数都没有好处。

只需使用

function showHideDiv(){}

并在您的元素上进行引用

<select onchange="showHideDiv"></select>
<select onchange="showHideDiv"></select>
<select onchange="showHideDiv"></select>
<select onchange="showHideDiv"></select>
<select onchange="showHideDiv"></select>
<select onchange="showHideDiv"></select>

Answer 2

无法使用javascript创建动态函数。您必须使用json创建它。

Answer 3

正如其他人所说，有更好的解决方案来解决您的问题。但是，出于学习的目的，我认为正确执行此操作的唯一方法是在其自己的范围内创建动态函数：

// Create own scope
var dynFuncs = {};

(function(){
    "use strict";
    var name = "CustomFunc";

    // Custom Actions (define your function body here)
    function CustomAction ( id ) {
        var id = "This object has id: "+id;

        // Read only getter for id
        Object.defineProperty(this, "id", {get: function(){return id}})
    } 

    // Implement the new function
    var func = new Function("name", "action",
        " return function " + name + "(id){ "+
        // Prevent running in global scope
        " if(this === window) throw TypeError('Invalid constructor! try using new');" +
        " return Object.create(new action(id)); };"
    )(name, CustomAction);

    // Add function to the dynFuncs scope
    Object.defineProperty(dynFuncs, name, {value: func } )
})();

for(let i=0; i<=5; i++){
    dynFuncs["ShowHideDiv_"+i] = new dynFuncs.CustomFunc("ShowHideDiv_"+i);
}

// Call each function
dynFuncs.ShowHideDiv_0.id; // ShowHideDiv_0
dynFuncs.ShowHideDiv_1.id; // ShowHideDiv_1
dynFuncs.ShowHideDiv_2.id; // ShowHideDiv_2
dynFuncs.ShowHideDiv_3.id; // ShowHideDiv_3
dynFuncs.ShowHideDiv_4.id; // ShowHideDiv_4
dynFuncs.ShowHideDiv_5.id; // ShowHideDiv_5

如何使用JavaScript在for循环内使函数名称动态化

3 个答案: