如何将this.value作为JavaScript中事件处理程序中函数的参数获取？

功能更改\u myselect（sel）{
返回新的sel；
}
功能客户（）{
var xmlhttp，myObj，i，tbl=''；
xmlhttp=新的XMLHttpRequest（）；
xmlhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
myObj=JSON.parse（this.responseText）；
tbl+=''；
对于（我在myObj）{
tbl+=''+myObj[i]+''；
}
tbl+=''；
document.getElementById（'showSelection'）。innerHTML=tbl；
}
};
open（'GET'，'suppliers.txt'，true）；
xmlhttp.send（）；
}

根据下拉菜单的值制作表格。
选择一个选项
客户
产品
供应商

上面代码的问题似乎就是您所指的问题

this.value

您可以重新访问

change\u myselect

函数，将

event

作为参数，然后从事件中提取所选值，例如：

var change_myselect = function(event) {
  var selectedValue = event && event.target && event.target.value || '';
  return selectedValue || '';
};

请确保还修改了代码的HTML部分，以便将事件作为参数传递：

<select onchange="change_myselect(event)">

---

您还可以将

change\u myselect

的输出存储在另一个变量中，以便在http请求逻辑中使用。

实际上，您不在任何地方使用select的值，也不执行任何xhr请求。 尝试将js代码更改为以下内容：

 function performXhr(entity) {
      var xmlhttp,
        myObj,
        i,
        tbl = "";

      xmlhttp = new XMLHttpRequest();
      xmlhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
          myObj = JSON.parse(this.responseText);
          tbl += '<table border="1">';
          for (i in myObj) {
            tbl += "<tr><td>" + myObj[i] + "</td></tr>";
          }
          tbl += "</table>";
          document.getElementById("showSelection").innerHTML = tbl;
        }
      };

      xmlhttp.open("GET", `${entity}.txt`, true);
      xmlhttp.send();
    }

功能性能（实体）{
var xmlhttp，
myObj，
我
tbl=“”；
xmlhttp=新的XMLHttpRequest（）；
xmlhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
myObj=JSON.parse（this.responseText）；
tbl+=''；
对于（我在myObj）{
tbl+=“+myObj[i]+”；
}
tbl+=”；
document.getElementById（“showSelection”）.innerHTML=tbl；
}
};
open（“GET”，`${entity}.txt`，true）；
xmlhttp.send（）；
}

和您的HTML标记

    <select onchange="performXhr(this.value)">
      <option value="">Choose an option</option>
      <option value="customers">Customers</option>
      <option value="products">Products</option>
      <option value="suppliers">Suppliers</option>
    </select>

选择一个选项
客户
产品
供应商

从HTML中获得的所有内容都是字符串。当您将按字面意思编写的

customers

传递给

change\u myselect

函数时，它是对

customers

函数的引用。当你传递这个.value时，它只是一个字符串。这就是为什么会出现错误而不是函数调用

根据您的代码，您似乎希望调用与所选选项的值同名的函数。在JavaScript中，字符串不能直接转换为引用（以理性的方式），这是引用函数时所需要的。您需要一个helper对象来获取引用

//Helper对象包含调用函数的方法
常量处理程序={
客户（）{customers（）；}，
产品（）{products（）；}，
供应商（）{suppliers（）；}
}
功能更改\u myselect（sel）{
//如果传递的属性名是handlers对象中的函数，请选中
if（处理程序的类型[sel]=“函数”）{
//找到名为传递字符串的方法
//调用找到的方法
处理程序[sel]（）；
}
}
功能客户（）{
console.log（'customers called'）；
}
功能产品（）{
log（'products called'）；
}
功能供应商（）{
console.log（“调用的供应商”）；
}

根据下拉菜单的值制作表格。
选择一个选项
客户
产品
供应商

当您将代码粘贴到帖子上时，是否不知何故弄乱了代码？目前，

change\u myselect

几乎什么都不做。当change\u myselect从“选项选择”获取客户值时，调用客户函数并显示名称。在提供的示例中，没有调用

客户

change\u myselect

只将其返回值返回到位空间

sel

in

change\u myselect

只是一个字符串，它是所选选项的值。我猜您的函数与

客户

更为相似，您希望调用与所选选项的值同名的函数吗？我使用客户的名称创建了一个函数。因此，当选项的值变为CUSTOMERS时，change_myselect调用CUSTOMERS函数并显示结果。否，

change_myselect

将一个字符串返回到联机处理程序，在那里它从未被使用过。是。你说得对。问题是这个价值观。我会试试这个，我想它会管用的。谢谢。：）@EliasAchilles如果没有确切的错误很难判断，但是，看起来您希望根据您选择的值获取txt文件，在这种情况下，您可以使用

performXhr

，尝试下面注释中的代码，并进行一些修改：

performXhr（实体）

–应该使用事件代替``performXhr（事件）

，然后再添加一个var

var entity=event&&event.target&&event.target.value | |'''''`示例：

此

在内联事件处理程序中并不指

窗口

，它指的是设置侦听器的元素。非常感谢您解决了此问题并给出了明确的解释。：）关于handlers对象，我有两个问题。1） 我通常创建一个具有名称/值对的对象，如下所示，

var car={type:“Fiat”，model:“500”，color:“white”}但处理程序对象不同。2） 我假设handlers对象中的属性是函数。我通常创建这样的函数，
function name（parameter1，parameter2，parameter3）{//code to execute}
但是handlers对象中的函数在名称前没有“function”这个词。我是编码和JS方面的新手，所以我的问题听起来可能很原始。：）是的，你的假设是正确的，它们是函数。这是一个ES6速记方法名，可以在和类中使用。