javascript - 一个函数如何使用另一个函数的变量？

Question

我有一个函数 addText()，它有 3 个变量(textInput、type、rowID)。我在声明它们时没有使用 var 关键字(以便它们可以在函数外部使用？)。我有很多这样创建的复选框:

<td><input type="checkbox" name="CB" id="monitor_'+rowID+'"/></td>

然后我有了这个函数，它需要使用这 3 个变量:

function monitoring(rowID, number, type) {
    var $check = $('#status_table #monitor_' + rowID);
    $('#test').append($check);
    if($check.is(':checked')) {
        $.post('/request', {
            inputText: number,
            key_pressed: type
        }).done(function (reply) {
            if(reply == "on") {
                $('#test').append("on");
            } else {
                $('#test').append("off");
            }
        });
    }
    return;
}

这里会调用这个函数:

$('#status_table #monitor_'+rowID).each(function(rowID, textInput, type){
    monitoring(rowID, textInput, type);
});

注意:inputText 是一个发布到某处的变量。

问题:

1. 这是调用带有变量的选择器的正确方法吗？

   $('#status_table #monitor_'+rowID)

2. 我是否应该在第二组代码中传递两次变量(在选择器函数和监控函数中)？

3. 如何正确传递变量？

4. 选择器是否正确？或者我应该将 $('#status_table #monitor_'+rowID).each(function(){}) 更改为 $('#status_table tr').each(function(){ })?

<强>5。添加:我应该在哪里以及如何调用“监控”功能？我把它放在 addText 下(引用下面的代码)但它没有意义，因为该功能只会在单击“添加”按钮时执行。此外，由于我的选择器是一个变量，我想确保它实际上可以对所有选中的复选框执行相同的操作。我该怎么做？

我试过了，但是当我选中复选框时，我的代码根本没有响应。

编辑:

这是我的 addText() 函数(我在此函数中包含函数监视，而不是像上面那样在另一个 jQuery 操作下):

function addText(add_type, fb_type) {
  $("#" + add_type + "Add").click(function () {
    $('.TextInput').empty();
    textInput = $("#" + fb_type + "TextInput").val();
    if(textInput.length === 0) {
      alert('please enter the fieldname');
      return;
    }
    index = $('#status_table tbody tr').last().index() + 1;
    type = $("#select-choice-1").find(":selected").text();
    rowID = type + textInput;
    var str = '<tr id="' + rowID + '">' + '<td>' + index + '</td><td>' + rowID + 
      '</td><td class="type_row_' + textInput + '">' + type + '</td><td class="feedback number">' +
      textInput + '</td>' + '<td><img src="static/OffLamp-icon.png" class="image" id="off"></td>' +
      '<td><input type="checkbox" name="CB" id="monitor_' + rowID +
      '" class="custom" data-mini="true" /><label for="CB"> </label></td><td class="outputRemove">x</td>' +
      '</tr>';
    if(alreadyExist(textInput, type)) {
      alert('Entry exists. Please enter another number.')
    } else {
      $('#status_table tr:last').after(str);
    }
    monitoring(rowID, textInput, type);
    return;
  });
}

表格的HTML:

<table class="config" id="status_table">
  <thead>
    <tr>
      <th colspan="4" ; style="padding-bottom: 20px; color:#6666FF; text-align:left; font-size: 1.5em">Output Status</th>
    </tr>
    <tr>
      <th>Index</th>
      <th>Row ID</th>
      <th>Feedback Type</th>
      <th>Feedback Number</th>
      <th>Status</th>
      <th>Monitor?</th>
      <th>Remove?</th>
    </tr>
  </thead>
  <tbody>
    <tr></tr>
  </tbody>
</table>

Answer 1

有几个问题。首先，这是行不通的:

$('#status_table #monitor_'+rowID).each(function(rowID, textInput, type){
  monitoring(rowID, textInput, type);
});

传递给 .each() 的函数有两个参数:indexInArray 和 valueOfElement ，尽管您可以随意调用它们 - 在在这种情况下，rowID 将是索引，textInput 将是元素的值； type 将是未定义的，因为没有值传递给它。

其次，在调用 ID 选择器之后使用 .each() 是没有意义的。 ID 选择器将最多选择一个元素，因为 ID 必须是唯一的。

如果 rowID、textInput 和 type 在您调用 .each() 时在范围内，那么你可以直接调用 monitoring 而根本不需要 .each() 。所以只是:

monitoring(rowID, textInput, type);