Question

我正在处理将用户输入与数组进行比较的页面。当用户在表单输入中输入值时，它会过滤数组以进行完全匹配，并显示正确的项目。我的问题是，如果用户输入的数值未包含在数组中，则不会显示错误消息。请看下面的代码。问题在于最后一个if语句正在寻找像“GT”“MT”等字符串的一部分。我不认为有必要包括所有内容因为我认为仅仅通过查看我的JavaScript就会知道问题是什么是。希望有人可以帮忙！谢谢！

//load gif on click
$(function(){

    //grab gif image and assign to variable
    var image = new Image();
        image.src='https://cento.com/images/gif/EARTH.gif';

    //store can code values in array
    var canCode = [
        {code: "7283SCBSGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7283SC1SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7283SC2SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7283SC3SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7283SC4SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7283SCASGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7338SC3SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7338SC4SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7338SCASGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7338SCBSGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7338SC1SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7338SC2SGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7355SEASGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7355SEBSGT", codeOZ: 5, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7257S93S2T", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7257S9AS2T", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7257S9BS2T", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7027S93S2T", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7339S91SGT", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7339S92SGT", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7339S93SGT", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7339S94SGT", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "7347S9ASGT", codeOZ: 3, species: "tonno", country: "Maldives", boat: "Dhonis"},
        {code: "61082SD1SMT", codeOZ: 5, species: "albacore"}
    ];


        //refresh map on button click
        $('#canCode').click(function(e){

            //assign user input to variable
            var usersInput=$("#can").val().toUpperCase();

            //filter out the array against user input
            let chosen = canCode.filter(can => can.code===usersInput);

            //assign data to variables 
            var code = chosen[0].code.toUpperCase();
            var codeOZ = chosen[0].codeOZ;
            var species = chosen[0].species;
            var country = chosen[0].country;
            var boat = chosen[0].boat;

            //prevent default behavior
            e.preventDefault();

            //compare user input against array
            if(code === usersInput) {

                console.log(code);
                console.log(codeOZ);
                console.log(species);
                console.log(country);
                console.log(boat);

                //search for tuna identifier and show correct information
                if (usersInput.includes("GT") || usersInput.includes("2T")) {
                    console.log("tonno");
                    $('.selectedTunaCan').show();    
                    $('.selectedAlbacoreTunaCan').hide();    
                    $('.fishSpeciesSkipjack').show();
                    $('.fishSpeciesAlbacore').hide();
                } else if (usersInput.includes("MT")) {
                    console.log("albacore");
                    $('.selectedTunaCan').hide();
                    $('.selectedAlbacoreTunaCan').show();
                    $('.fishSpeciesSkipjack').hide();
                    $('.fishSpeciesAlbacore').show();
                } else if (usersInput !== code) { 
                    console.log("invalid code entered");
                }

            } 

        }); 

});

Answer 1

让我们删掉不必要的部分并制作mcve（你应该在问之前做过）

if (code === usersInput) { // <--- 1
    if (usersInput.includes("GT") || usersInput.includes("2T")) {
        //...
    } else if (usersInput.includes("MT")) {
        //...
    } else if (usersInput !== code) { // <--- 2
        console.log("invalid code entered"); //never reached
    }
}

现在非常清楚1和2不能同时发生，因此永远不会达到控制台日志。

无法弄清楚为什么我不能显示值不在数组中的错误消息

1 个答案: