手機號自動補空格

pc端通過keyup事件做處理:注意添加maxlength="13"

<div class="m-input-wapper" id="m-input-wapper">

      <input type="text" class="m-input" id="m-input" maxlength="13">

      <input type="button" class="m-search-btn" id="m-search-btn" value="獲取手機號">

 </div>

  $('#m-input').on('keyup', function () {
    var that = $(this);
    var value = that.val();
    value = value.replace(/[^0-9]/ig, ""); 
    var arr = value.split('');
    if (arr.length >= 4) {
      arr.splice(3, 0, ' ');
    } 
    if (arr.length >= 9) {
      arr.splice(8, 0, ' ');
    }
    value = arr.join('');
    that.val(value);
  });
  $('#m-search-btn').on('click', function () {
    var value = $('#m-input').val();
    value = value.replace(/[^0-9]/ig, ""); 
    console.log(value);
  })

 

手機端不支持keyup事件。採用input事件處理、先驗證是否有漢字。否則

    validatePhone(){

            var pattern = new RegExp("[\u4E00-\u9FA5]+");

            if(pattern.test(this.phone)){

               this.phone=''

               this.disabled=true

                return

            }else{

                this.phone= this.phone.replace(/(\d{3})(\d{4})/,"$1 $2 ")

                let val= this.phone.replace(/\s+/g,"");

                if(val.length==11){

                    this.disabled=false

                    if(checkPhone(val)){

                        ajax(...)

                    }else{

                        this.$toast("手機號格式有誤")

                    }

                }else{

                    this.disabled=true

                }

            }

        },

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章