2016-12-06 50 views
1

如何在文本框中切換字符和數字輸入?JQuery切換數字和字符輸入

我有一個jQuery函數,以允許在輸入

只有數字
$('.numeric').on('input', function (event) { 
    this.value = this.value.replace(/[^0-9]/g, ''); 
}); 

我只應用類numeric在輸入框中,它會限制字符輸入。

我的問題是這樣的。

我有一個選擇框與各國列出

<select class="form-control" id="country_select" name="country"> 
    <option value="44">United Kingdom</option> 
    <option value="681">Wallis and Futuna</option> 
    <option value="967">Yemen</option> 
    <option value="260">Zambia</option> 
    <option value="263">Zimbabwe</option> 
</select> 

每當我選擇United Kingdom我想刪除其上有numeric類我的輸入框中輸入字符限制。我想允許字母和數字是在文本框

<input placeholder="Zip/Postal Code" class="numeric" id="company_zip" name="company_zip" type="text"> 

我有這樣的jQuery代碼輸入,但它無法正常工作。我試圖刪除numeric類以允許輸入字母。但它不起作用。

$('#country_select').change(function(){ 
    var zip = $('#company_zip'); 
    var country = $(this); 
    $('#area_code').val($(this).val()); 

    if (country.val() == 44) { 
     zip.removeClass('numeric'); 
    }else{ 
     if (!zip.hasClass('numeric')) { 
      zip.addClass('numeric'); 
     } 

    } 
}); 

回答

4

它沒有工作的原因是因爲事件已經附加到元素。移除類不會將已經關聯的事件移除到元素。

你還是必須在文本框的更改事件所選選項值的檢查:

var country = $('#country_select'); 
$('.numeric').on('input', function (event) { 
    if(country.val() == 44) 
    this.value = this.value.replace(/[^0-9]/g, ''); 
}); 
+0

@KimCarlo:很高興幫助:) –

0

當改變事件被觸發你的類被刪除,但已被已添加到輸入框的行爲將保持直到我們刷新頁面。您可以通過包括

` $('.numeric').on('input', function (event) { 
     this.value = this.value.replace(/[^0-9]/g, ''); 
    }); ` 

當改變事件被觸發實現這個

的一種方式。