Javascript 如何重构长if语句？

我有一个很长的if语句，我想重构它。该语句侦听单击，然后根据五个文本框中是否包含任何内容更新其中一个文本框。如何更改代码以提高效率

$('#img1').click(function() {
if ($('#card1').val().length === 0) {
    $('#card1').val('A feeling of warmth');
} else if ($('#card2').val().length === 0)  {
    $('#card2').val('A feeling of warmth');
} else if ($('#card3').val().length === 0){
  $('#card3').val('A feeling of warmth');
} else if ($('#card4').val().length === 0){
  $('#card4').val('A feeling of warmth');
} else if ($('#card5').val().length === 0){
  $('#card5').val('A feeling of warmth');
}

});

你可以使用一个循环

$('#img1').click(function() {
    var items = ["#card1", "#card2", "etc"];
    for(var i=0;i<items.length;i++){
        if ($(items[i]).val().length === 0) {
            $(items[i]).val('A feeling of warmth');
        }
    }
});

它至少更容易阅读。此外，如果你的按钮总是卡+一个数字，你可以使它更简单，不容易阅读，只是少行和维护

$('#img1').click(function() {
    for(var i=0;i<=5;i++){
        if ($("#card" + i).val().length === 0) {
            $("#card" + i).val('A feeling of warmth');
        }
    }
});

你可以使用一个循环

$('#img1').click(function() {
    var items = ["#card1", "#card2", "etc"];
    for(var i=0;i<items.length;i++){
        if ($(items[i]).val().length === 0) {
            $(items[i]).val('A feeling of warmth');
        }
    }
});

它至少更容易阅读。此外，如果你的按钮总是卡+一个数字，你可以使它更简单，不容易阅读，只是少行和维护

$('#img1').click(function() {
    for(var i=0;i<=5;i++){
        if ($("#card" + i).val().length === 0) {
            $("#card" + i).val('A feeling of warmth');
        }
    }
});

})

---

})

您似乎正在使用JQuery。可以使用选择器和筛选器隔离第一个空项：

$'img1'。单击函数{ $'输入：文本[id^=卡]' .filterfunction{返回$this.val==；} 第一 “一种温暖的感觉”； }; 点击我

---

看起来您正在使用JQuery。可以使用选择器和筛选器隔离第一个空项：

$'img1'。单击函数{ $'输入：文本[id^=卡]' .filterfunction{返回$this.val==；} 第一 “一种温暖的感觉”； }; 点击我 给所有的卡片上相同的等级。 然后使用选择器$'.yourclass'

现在对each.each函数使用jQuery来迭代所有元素。在循环中检查值，将其设置为所需的值，并在设置值时返回false，因为此出口是循环

$('.yourclass').each(
    function () {
        if (this.val().length === 0) {
            this.val('your value');
            return false; // exit loop
        }
    });

给所有的卡片上相同的等级。 然后使用选择器$'.yourclass'

现在对each.each函数使用jQuery来迭代所有元素。在循环中检查值，将其设置为所需的值，并在设置值时返回false，因为此出口是循环

$('.yourclass').each(
    function () {
        if (this.val().length === 0) {
            this.val('your value');
            return false; // exit loop
        }
    });