2016-08-04 69 views
1


首先對不起我的英語不好。我試圖對輸入字段進行驗證長度。如果我手動輸入它的工作,但如果我用Jquery(我用JKeyboard)做的虛擬鍵盤它不工作。任何解決方案?驗證長度不工作,如果使用虛擬鍵盤

這是我的驗證長度腳本:

validationLength = 10; 

$('#jkeyboard').on('keyup keydown change keypress', function() { 
    if($(this).val().length > validationLength){ 

     val=$(this).val().substr(0,$(this).val().length-1); 
     $(this).val(val); 
    }; 
}); 

這是我JKeyboard腳本:

$(document).ready(function() { 

    $('#jkeyboard').focus(function() { 

     var keys = [['`', '1', '2', '3', '4', '5', '6', '7', '8', '9', '0', '-', '='], 
        ['q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p', '[', ']'], 
        ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l', ';', "'",'#'], 
        ['z', 'x', 'c', 'v', 'b', 'n', 'm', ',', '.', '/']]; 

     var $keyboard = $('<div/>').addClass('jkeyboard-jk'); 
     var buttons = []; 

     for(var i = 0; i < keys.length; i++){ 
      var $wrap = $('<div/>'); 

      for(var k = 0; k < keys[i].length; k++){ 
       var button = $('<button/>').text(keys[i][k]); 
       $wrap.append(button); 
      } 
      buttons.push($wrap); 
     } 

     $keyboard.append(buttons); 

     if(!$('.jkeyboard-jk').is('*')){ 
      $('body').append($keyboard); 
     } 

    }); 

    // button click functions 


    function insertAtCaret(areaId,text) { 
    debugger; 
     var txtarea = document.getElementById(areaId); 
     var scrollPos = txtarea.scrollTop; 
     var strPos = 0; 
     var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? 
      "ff" : (document.selection ? "ie" : false)); 
     if (br == "ie") { 
      txtarea.focus(); 
      var range = document.selection.createRange(); 
      range.moveStart ('character', -txtarea.value.length); 
      strPos = range.text.length; 
     } 
     else if (br == "ff") strPos = txtarea.selectionStart; 

     var front = (txtarea.value).substring(0,strPos); 
     var back = (txtarea.value).substring(strPos,txtarea.value.length); 
     txtarea.value=front+text+back; 
     strPos = strPos + text.length; 
     if (br == "ie") { 
      txtarea.focus(); 
      var range = document.selection.createRange(); 
      range.moveStart ('character', -txtarea.value.length); 
      range.moveStart ('character', strPos); 
      range.moveEnd ('character', 0); 
      range.select(); 
     } 
     else if (br == "ff") { 
      txtarea.selectionStart = strPos; 
      txtarea.selectionEnd = strPos; 
      txtarea.focus(); 
     } 
     txtarea.scrollTop = scrollPos; 
    } 

    $(document).on('click', '.jkeyboard-jk button', function(e){ 
     e.preventDefault(); 
     var key = $(this).text(); 

     insertAtCaret('jkeyboard', key);  
    }); 

    $(document).on('click', '.delete', function(e){ 

      var $content = $('#jkeyboard'); 
      var html = $content.val(); 

      $content.val(html.substr(0, html.length - 1)); 
      return false; 


    }); 


    /*$('.jkeyboard').blur(function(){ 
     $('.jkeyboard-jk').remove(); 
    });*/ 

}); 

這是我的HTML代碼:

<input type="text" name="msidn" id="jkeyboard"> 

回答

0

你不聽.jkeyboard-jk這是你的虛擬鍵盤。給它添加一個監聽器。僅供參考,請創建一個用於驗證的獨立函數。您的輸入和虛擬鍵盤監聽器都可以觸發該驗證功能。

+0

我用#jkeyboard進行收聽。我應該爲此做些什麼?你能告訴我的例子或任何 –