如何引用在JavaScript中动态创建的输入的值

Question

我正在创建一个输入表。

更改输入时，更改事件应触发函数（if (!mA11yManager.isEnabled()) { return; } // Prior to SDK 16, announcements could only be made through FOCUSED // events. Jelly Bean (SDK 16) added support for speaking text verbatim // using the ANNOUNCEMENT event type. final int eventType; if (Build.VERSION.SDK_INT < 16) { eventType = AccessibilityEvent.TYPE_VIEW_FOCUSED; } else { eventType = AccessibilityEventCompat.TYPE_ANNOUNCEMENT; } // Construct an accessibility event with the minimum recommended // attributes. An event without a class name or package may be dropped. final AccessibilityEvent event = AccessibilityEvent.obtain(eventType); event.getText().add(text); event.setEnabled(isEnabled()); event.setClassName(getClass().getName()); event.setPackageName(mContext.getPackageName()); // JellyBean MR1 requires a source view to set the window ID. final AccessibilityRecordCompat record = new AccessibilityRecordCompat(event); record.setSource(this); // Sends the event directly through the accessibility manager. If your // application only targets SDK 14+, you should just call // getParent().requestSendAccessibilityEvent(this, event); mA11yManager.sendAccessibilityEvent(event);} ）以更改基础数据中的数据。这是我创建表格的地方。

updatePlanner()

正如您所看到的，我正在尝试使用function tableCreate(columns, rows){ var body = document.getElementById('planBuilderTable'), tbl = document.createElement('table'); // header code removed for(var i = 0; i < rows; i++){ var tr = tbl.insertRow(); var week = 0; for(var j = 0; j < columns * 3; j++){ var td = tr.insertCell(); td.style.height = "26px"; switch(j % 3){ case 0: var currItem = document.createElement('input'); currItem.value = builerObj.dataArray[2][week][i][0]; currItem.addEventListener("change", function(){ updatePlanner(this.value, week, i, 0); //<-----------THIS IS MY ISSUE }); break; case 1: var currItem = document.createElement('input'); currItem.value = builerObj.dataArray[2][week][i][1]; break; case 2: var currItem = document.createElement('button'); currItem.style.height = "26px"; currItem.style.border = "none"; currItem.style.padding = "0px"; currItem.style.display = "block"; var span = document.createElement('span'); if (builerObj.dataArray[2][week][i][2] == 1){ span.className = "glyphicon glyphicon-ok box"; } else{ span.className = "glyphicon box"; } currItem.appendChild(span); week += 1; break; } currID = i.toString() + "-" + j.toString() currItem.setAttribute("id", currID); currItem.style.width = "40px"; td.appendChild(currItem); td.style.border = '1px solid black'; } } body.innerHTML = ""; body.appendChild(tbl); } ，但这并不会返回值。我之前也尝试过分配ID并引用它：

this.value

Answer 1

this.value返回正确的值，但其他参数，week和i，不具备您期望的值。您希望他们在侦听器添加时具有值，而是在侦听器执行时具有值。要解决此问题，您可以将这些值作为属性存储在输入标记中，稍后再检索它们，如下所示：

    $(currItem).attr("data-week", week);
    $(currItem).attr("data-i", i);
    currItem.addEventListener("change", function(){
         var week_value = $(this).attr("data-week");
         var i_value = $(this).attr("data-i");
         updatePlanner(this.value, parseInt(week_value), parseInt(i_value), 0);
    }, false);

Answer 2

你可以在这里寻找几件事。 最简单的方法是将事件参数添加到回调函数中，如下所示：

currItem.addEventListener("change", function(e){
  updatePlanner(e.target.value, week, i, 0);
});