這個js代碼不起作用，我需要另一雙眼睛

Question

我正在嘗試使用js添加選定的選項以進行標記。 我嘗試在“Shopify”上添加嵌入代碼，但它不會更改另一個中的選項。 當使用w3school編輯器時它可以工作。 知道為什么它在這里不起作用嗎？

<div style="text-align:center;">
  <table border="2">
    <tbody>
      <tr>
        <td>
          <select onchange="genderChoose()" id="userGender"> 
            <option value="null">Choose gender</option><option value="1">Women</option>
            <option value="Men">Men</option> 
          </select>
        </td>
        <td>
          <select id="category">
            <option value="Choose category">Choose category
            </option>
          </select>
        </td>
        <td>
          <input type="text"><input id="searchygolide" type="submit" 
          value="Ygolide it !">
        </td>

      </tr>
    </tbody>
  </table>
  <script>
    function genderChoose(){
      if (document.getElementById("userGender").value == 1) 
      {
        document.getElementById("category").innerHTML = '<option 
        value="shirts">shirts</option><option value ="tops">tops</option>'
      }
    }
  </script>
</div>

Answer 1

在您嘗試設置為#category元素的innerHTML的字符串中間似乎存在換行符，就在value="shirts" 。 您應該會在控制台中看到錯誤。 刪除換行符以修復字符串。

 <script> function genderChoose(){ if (document.getElementById("userGender").value == 1) { document.getElementById("category").innerHTML = '<option value="shirts">shirts</option><option value ="tops">tops</option>' } } </script>