從HTML <select>

調用類的構造函數在ECMAScript中6，說我有幾個類：從HTML <select>

class A { 
    constructor() {...} 
    methodA() {...} 
} 
class B { 
    constructor() {...} 
    methodB() {...} 
}

我希望用戶能夠選擇這些類別從<select>菜單實例。這裏是什麼，我已經試過（不成功）草圖：

<html> 
<body onload="init()"> 
<select id="my_select"></select> 
</body> 
</html>

的<select>得到由init()填充：

function init() { 
    var select = document.getElementById("my_select") 
    var option = document.createElement("option") 
    option.value = A.constructor 
    option.text = A.name 
    select.add(option) 
    // ditto for B 
}

然後在以後的某個時候，我想構建什麼選擇：

var X = document.getElementById("my_select").value 
var x = new X // doesn't work

這樣做的最佳方法是什麼？我的方法完全錯誤嗎？

來源

2016-04-15 aslanides

類放在然後可以通過字串值以後引用的對象。

class A { 
    constructor() {} 
    methodA() {} 
} 
class B { 
    constructor() {} 
    methodB() {} 
} 

let classMemory = { 
    A, // Since you are using es6, you can do this 
    B 
};

然後，在init功能，你會怎麼做：

option.value = A.name; // Not using the constructor 
option.text = A.name;

最後，這個工程：

var x = new classMemory[document.getElementById("my_select").value];

來源

2016-04-15 02:00:08 KevBot

偉大的答案！乾杯。 – aslanides

無論這是否是您嘗試使用的任務的最佳方法我不確定但是如果您希望這樣做，您可以使用eval函數來允許您執行動態生成的JavaScript代碼。

eval('var x = new' + X);

顯然需要調整以適應您的需求。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval

來源

2016-04-15 01:47:10

回答

相關問題