将字符串与存储的变量列表进行匹配

Question

使用JS/jQuery,最好的方法是什么？

我有5个变量:

var fruit1 = "apple";
var fruit2 = "mango";
var fruit3 = "orange";
var fruit4 = "banana";
var fruit5 = "melon";

然后我有一个单击某个水果的列表元素:

<li id="banana">Banana</li>

我在脚本中得到了它的ID:

$("li").on("click", function() {
    var selectedfruit = $(this).attr("id");
});

如何selectedfruit与变量列表匹配,以便返回fruit4我可以执行的操作？

次要问题,我应该将变量列表放在数组中吗？

非常感谢.

编辑:我很抱歉,但我犯了一个大错

我需要selectedfruit使用变量名来验证,而不是变量内容.

所以,标记将是这样的:

<li id="fruit4">Mystery fruit</li>

Answer 1

是的,这绝对是一个阵列的工作.

var fruits = ["apple", "mango", "orange", "banana", "melon"];

然后在您的单击处理程序中,您可以搜索此数组,并获取其索引.

$("li").on("click", function() {
    // Note: This will return -1, if it's not in the array
    var selectedfruit = $.inArray($(this).attr("id"), fruits); // 3 (arrays are zero-indexed)
});

更新根据您的更新,我会使用对象.

var fruits = {
    fruit1: "apple",
    fruit2: "mango",
    fruit3: "orange",
    fruit4: "banana",
    fruit5: "melon"
};

然后,您可以使用ID获取值并进行比较.

$("li").on("click", function() {
    var selectedfruit = fruits[$(this).attr("id")];  // banana
});