我有一個(gè)使用JavaScript的表單，它根據(jù)用戶(hù)的輸入，使用& quot如果/否則& quot聲明。但是，輸入字段不接受空格。它將接受除空格以外的所有字符。我似乎想不出是什么導(dǎo)致了這種情況。

編輯:我已經(jīng)為整個(gè)表單添加了HTML，包括提交按鈕。

編輯2:我也更新了我的JS來(lái)反映“轉(zhuǎn)換”語(yǔ)句，而不是Jojo先生建議的“如果”。

編輯3:只是澄清一下，如果我在里面輸入空格，它會(huì)工作。但是如果我只是鍵入它們，它不會(huì)顯示一個(gè)空格。

下面是輸入表單附帶的HTML、CSS和JS。

<!-- This is the HTML for the entire form -->

    <<form onSubmit="return checkAnswer();">
                                              <input class="nice-select wide" placeholder="Enter Your State" id="state" type="text" maxlength="55" class="box" autofocus />
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--<p>You have to pay: <span>$0</span></p>-->
                            <div class="submit_btn">
                                <button class="boxed-btn3" value="SUBMIT" type="submit">Continue</button>
                            </div>
                          </form>

<!-- This is the script that is in the head of the document controlling the redirect. -->

    <script>
    function checkAnswer(){
      var response = document.getElementById('state').value;

      if (response == "Kentucky")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "kentucky")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "KY")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "ky")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "New York")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "new york")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "NY")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "ny")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "Washington")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "Washington St")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "Washington ST")
        location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "Washington st")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "washington")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "washington state")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "Washington State")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "Washington state")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "washington State")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "wa")
      location = 'https://linxdalton.com'; // 'right.html';

      else if (response == "WA")
      location = 'https://linxdalton.com'; // 'right.html';

      else
      location = 'https://google.com'; // 'wrong.html';
      return false;
    }
    </script>

下面是與input元素相關(guān)聯(lián)的所有CSS。

.nice-select::after {
  content: "\f0d7";
  display: block;
  pointer-events: none;
  position: absolute;
  right: 30px;
  top: 50%;
  transition: all 0.15s ease-in-out;
  width: 5px;
  font-family: 'fontawesome';
  color: #ddd;
  transform: translateY(-50%);
  font-size: 16px;
  right: 25px;
  color: #AAB1B7;
  height: auto;
  margin-top: 0;
}


-webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    color: -internal-light-dark-color(black, white);
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    -webkit-appearance: textfield;
    background-color: -internal-light-dark-color(white, black);
    -webkit-rtl-ordering: logical;
    cursor: text;
    margin: 0em;
    font: 400 11px system-ui;
    padding: 1px;
    border-width: 2px;
    border-style: inset;
    border-color: initial;
    border-image: initial;
}

-webkit-tap-highlight-color: blue;
    background-color: #fff;
    border-radius: 5px;
    border: solid 1px #e8e8e8;
    box-sizing: border-box;
    clear: both;
    display: block;
    float: left;
    font-family: inherit;
    font-size: 14px;
    font-weight: normal;
    height: 42px;
    line-height: 40px;
    outline: none;
    padding-left: 18px;
    padding-right: 30px;
    position: relative;
    text-align: left !important;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    white-space: nowrap;
    width: auto;
}


    width: 100%;
    height: 50px;
    line-height: 50px;
    border-radius: 5px;
    color: #7A838B;
    margin-bottom: 15px;

這是與輸入元素相關(guān)的所有代碼。如果你能找到任何不接受空格的理由，請(qǐng)告訴我！

謝謝！

最好編寫(xiě)https://developer . Mozilla . org/en-US/docs/Web/JavaScript/Reference/Statements/switch

function checkAnswer(){
  let response = document.getElementById('state').value;

  switch (response) {
    case 'Kentucky':
    case 'kentucky':
    case 'KY':
    case 'ky':
    case 'New York':
    case 'new york':
    case 'NY':
    case 'ny':
    case 'Washington':
    case 'Washington St':
    case 'Washington ST':
    case 'Washington st':
    case 'washington':
    case 'washington state':
    case 'Washington State':
    case 'Washington state':
    case 'washington State':
    case 'wa':
    case 'WA':
    location = 'xyz.com'; // 'right.html';
      break;

    default:location = 'https://google.com'; // 'wrong.html';
      break;
  }

  return false;
}

我已經(jīng)解決了！這是我鏈接到影響空間的頁(yè)面的腳本，我不完全確定影響空間的腳本內(nèi)容，但盡管如此，問(wèn)題已經(jīng)解決。

由于以下腳本，我在Angular項(xiàng)目中遇到了同樣的問(wèn)題

fromEvent(window, 'keydown')
  .subscribe((event: any) => {
  if ([32, 37, 38, 39, 40].indexOf(event.keyCode) > -1) {
    event.preventDefault();
  }
});

因?yàn)榭崭矜I碼是32，所以在所有輸入中都不能輸入空格。 請(qǐng)刪除此腳本或用nativeElement替換window，以便在特定組件上應(yīng)用腳本。