javascript / jquery根據在文本輸入字段中輸入的值更改html元素

Question

聽起來很簡單，但是我是Java語言的新手，因此嘗試/創建該腳本的過程非常艱苦。 我有一張信用卡的BIN編號列表，我試圖獲取卡號字段的前6位數字，並檢查它是哪種卡，然后根據輸入的BIN在屏幕上顯示適當的卡徽標。

我已經能夠創建一個非常簡單的腳本來檢查輸入並可以更改值或元素，但是我還沒有弄清楚如何執行相反的操作。 如果用戶刪除卡並重新輸入卡信息，我需要能夠刪除卡徽標並替換它。

這是非常簡單的演示。 http://jsfiddle.net/6HmxM/653/

$( "input" )

  .keyup(function() {
  if ($( "input" ).val() == 45) {
      var val = "Visa";
  } 
  $( "p" ).text( val )
})

Answer 1

在這種情況下，最好使用switch來打印默認值，該默認值可能為空白。 剛剛成立每種情況下打印出你想要的東西，否則將默認為無論是在定義default: 。

$( "input" )

  .keyup(function() {

      var $value = $(this).val(),
          output = "";

      switch( $value ) {

          case "45" :
              output = "Visa";
          break;

          case "44" :
              output = "Mastercard";
          break;

          default:
              output = "Nothing";
              break;


      }

      $( "p" ).text( output )
  })

示例： http ： //jsfiddle.net/6HmxM/655/

雖然，如果您要基於前6個字符進行調整，則可能需要對switch進行調整，可能是RegEx會與前6個字符匹配，因為除非每個擊鍵都完全匹配，否則output將為零。 在這種情況下，您可能需要這樣的東西：

$( "input" )

  .keyup(function() {

      var $value = $(this).val(),
          output = "";

      switch( true ) {

          case /4567/.test($value) :
              output = "Visa";
          break;

          case /4412/.test($value) :
              output = "Mastercard";
          break;

          default:
              output = "Nothing";
          break;

       }

      $( "p" ).text( output )
  })

示例： http ： //jsfiddle.net/6HmxM/656/