Javascript-使用字符串使函數原型化

Question

所以我是一個超級JS新手，我什至不確定我是否正確地問了這個問題，但是...

我試圖動態創建按鈕，然后將其onclick事件偵聽器設置為一組預定功能之一。 我希望能夠執行以下兩種方法之一：

var newInput = document.createElement('input');
newInput.parameters = "xyz";
document.getElementById("element").appendChild(newInput);
newInput.onclick = "funcsnip" + array[variable] + "()";

或者，

var newInput = document.createElement('input');
newInput.parameters = "xyz";
document.getElementById("element").appendChild(newInput);
newInput.onclick = array[variable];

數組中存儲有“ myFunction（）”原語的位置。

毫無疑問，我應該“做”一百萬件事，但是我對我的大部分代碼感到滿意，我只想基本了解如何將字符串作為onclick的參數傳遞（如果可以的話）。

或者，如果不可能的話，將onclick事件附加到動態輸入元素的另一種方法。

更簡單，更優雅，更好。 謝謝！

Answer 1

您不能將字符串傳遞給onclick監聽器。 它應該是一個功能。 或者，您可以做的是創建功能圖。

假設您有以下可用功能：

function oneFunc() { console.log('one');
function twoFunc() { console.log('two');

然后，您可以創建一個映射：

var map = {
  one : oneFunc,
  two : twoFunc
};

因此，您可以通過調用map.one或map["one"]來訪問oneFunc 。

現在解決您的問題很簡單

var newInput = document.createElement('input');
var variable = "one";
// var variable = "two";
newInput.parameters = "xyz";
document.getElementById("element").appendChild(newInput);
// You pass an actual function, but using a string parameter.
newInput.onclick = map[variable];

當您單擊一個按鈕時，您將在控制台中看到“一個”。

Answer 2

如果每個代表一個功能的按鈕都有一個字符串，則可以編寫

var functionCollection = {
  'stringOne': function() {
   ...
  }
}

...

newInput.onclick = functionCollection[myStringValue];

或者您可以創建一個處理程序函數，然后通過綁定以字符串類型調用它，例如

function clickHandler(stringValue) {
  switch (stringValue) {
    case 'stringOne':
      return someSpecialFunction();
    ...
  }
}

...

newInput.onclick = clickHandler.bind(this, myStringValue);

Answer 3

兩者都是newInput。 setAttribute （“ onclick”，“ alert（1）”）和newInput.setAttribute（“ onclick”，“ function（）{alert（1）}”都可以使用。您的代碼無效，因為您試圖設置onclick 屬性上的函數字符串，它需要一個真實的函數對象。

話雖如此，您實際上應該使用addEventListener或類似jquery的抽象。