javascript - 按钮在桌面上工作，调整到移动设备，但在真正的移动设备上没有反应

Question

我正在学习 Api，这几乎是我的第一件事。有一个搜索按钮停止在移动设备上工作。找不到原因/你能看看吗？

https://codepen.io/DeanWinchester88/pen/ExvxdxX

 function showPokemonSearchResult(){
    
   let enteredPokemonName = document.getElementById("pokemonNameByUser").value;
   targetPokemon = `https://pokeapi.co/api/v2/pokemon/${enteredPokemonName}`
    console.log("target pokemon",targetPokemon)
   
    fetch(targetPokemon)
       .then(res  =>  {
          if(res){
            console.log("Success");
            // console.log("res.json",res.json());
            return res.json()
            
            }else {
            console.log("Failure");
          }
         })
        .then(data  =>{
         
        let gotDivForPokemonSearchResult = document.getElementById("divForPokemonSearchResult");
        gotDivForPokemonSearchResult.innerHTML = `
        <h2>  ${data.name}</h2><br>
        <img src=${data.sprites["front_default"]}></img>
        <img src=${data.sprites["back_default"]}></img>
        <p class="text2">Weight: ${data.weight}</p>
        <p class="text2">Heigth: ${data.height}</p>
        <p class="text2">Base experience: ${data["base_experience"]}</p>
        `
        console.log(data.id)
          
    })
  }

Answer 1

正如我所看到的，pokeapi.co/api/v2/pokemon/它区分大小写，并且从移动设备上，键盘通常将第一个字母大写。

例如，如果您的移动键盘使用 Venusaur 更正 venusaur，则搜索将失败。

您可能会考虑.toLowerCase()在阅读输入时添加 a 以完全避免此问题。

let enteredPokemonName = document.getElementById("pokemonNameByUser").value.toLowerCase();