我有在更改事件上触发的JavaScript函数。第一步是检查用户选择哪个值。接下来是找到将填充到另一个选择菜单的匹配选项集。这是我的代码示例:
$("#type").on("change", function() {
var typeVal = $(this).val();
var approved = [{
id: 1,
text: "Month"
}, {
id: 2,
text: "Week"
}];
var active = [{
id: 1,
text: "Progress"
}, {
id: 2,
text: "No Feedback"
}, {
id: 3,
text: "Office Closed"
}];
var inactive = [{
id: 1,
text: "Missing"
}, {
id: 2,
text: "Expired"
}];
var terminated = [{
id: 1,
text: "Natural"
}, {
id: 2,
text: "None"
}];
var menuOptions = {
"1": "approved",
"2": "active",
"3": "inactive",
"4": "terminated",
"5": "inactive",
"6": "active"
};
var getOptions = menuOptions[typeVal];
console.log(eval(getOptions));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="type" id="type">
<option value="">Select Type</option>
<option value="1">Approved</option>
<option value="2">Active</option>
<option value="3">Inactive</option>
<option value="4">Terminated</option>
<option value="5">Closed</option>
<option value="6">Pending</option>
</select>
到目前为止,我的代码可以运行,但是我使用了
eval()
函数。我看到了很多有关该功能的文章,如果可能,应该避免这样做。我在寻找是否有更好的方法来实现相同的目标,而在javascript中没有该功能呢?如果您有任何建议,请让我知道。谢谢。 最佳答案
您可以访问特定上下文中存在的变量,就像访问数组或对象键一样。
如果onchange
回调函数中包含变量,则可以将window[getOptions]
更改为this[getOptions]
。
$("#type").on("change", function() {
var typeVal = $(this).val();
var getOptions = menuOptions[typeVal];
console.log(window[getOptions]);
});
var menuOptions = {
"1": "approved",
"2": "active",
"3": "inactive",
"4": "terminated",
"5": "inactive",
"6": "active"
};
var approved = [{
id: 1,
text: "Month"
}, {
id: 2,
text: "Week"
}];
var active = [{
id: 1,
text: "Progress"
}, {
id: 2,
text: "No Feedback"
}, {
id: 3,
text: "Office Closed"
}];
var inactive = [{
id: 1,
text: "Missing"
}, {
id: 2,
text: "Expired"
}];
var terminated = [{
id: 1,
text: "Natural"
}, {
id: 2,
text: "None"
}];
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="type" id="type">
<option value="">Select Type</option>
<option value="1">Approved</option>
<option value="2">Active</option>
<option value="3">Inactive</option>
<option value="4">Terminated</option>
<option value="5">Closed</option>
<option value="6">Pending</option>
</select>
关于javascript - 如何找到所选选项的匹配变量名?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58011591/