JQUERY在每一次事件的內容火災，當我在屏幕鍵盤

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>  
<script type="text/javascript" src="jquery-1.6.4.js"></script> 
<script type="text/javascript" src="jquery-fieldselection.js"></script> 

<script> 
    $(document).ready(function(){ 
     var CurrentTextBoxID = ""; 

     // toggles the keyboard to show or hide when link is clicked 
     $(":text").focus(function(e) {    
      CurrentTextBoxID = this.id; 
      var top = ($(window).height() - $('#keyboard').height()) - 25;   
      var left = ($(window).width() - $('#keyboard').width())/2; 

      //alert(CurrentTextBoxID + " focus In");   
      $('#keyboard').css(
       {    
        "left": left+"px", 
        "top": top+"px" 
       } 
      ).toggle();  

     }); 

     $(":text").focusout(function() { 
      $('#keyboard').hide(); 
     }); 

     // function thats called when any of the keys on the keyboard are pressed 
     $("#keyboard input").bind("click", function(e) {      
      $('#'+CurrentTextBoxID).replaceSelection($(this).val(), true);  
     }); 
    }); 
</script> 

<style type="text/css"> 
#keyboard { 
    position: fixed; 
    background: #eee; 
    display: none; 
    border: 1px solid #ccc; 
    border-radius:7px; 
    width: 700px; 
    height: 240px; 
    padding: 5px; 
    cursor: move; 
    box-shadow: -5px -5px 5px 5px #888; 
    -moz-border-radius: -5px -5px 5px 5px #888; 
    -webkit-border-radius: -5px -5px 5px 5px #888; 
} 
</style> 
</head> 
<body> 
<form id="frmOnScreenKeyboard" name="frmOnScreenKeyboard"> 

<table border="0" cellpadding="0" cellspacing="0" > 
<tr> 
    <td> 
     <input type="text" name="txtTest1" id="txtTest1"/> 
    </td> 
</tr> 
<tr> 
    <td> 
     <input type="text" name="txtTest2" id="txtTest2"/>  
    </td> 
</tr> 
<tr> 
    <td> 
     <input type="text" name="txtTest3" id="txtTest3"/>  
    </td> 
</tr> 
<table> 


<table height="900px"> 
</table> 

<div id="keyboard"> 
    <table border=1 cellpadding=0 cellspacing=0> 
     <tr> 
      <td> 
       <div id="row2_shift"> 
        <table border=1 cellpadding=0 cellspacing=0> 
        <tr>         
         <td><input name="a" type="button" value="A" /></td> 
         <td><input name="s" type="button" value="S" /></td> 
         <td><input name="d" type="button" value="D" /></td> 
         <td><input name="f" type="button" value="F" /></td> 
         <td><input name="g" type="button" value="G" /></td> 
         <td><input name="h" type="button" value="H" /></td> 
         <td><input name="j" type="button" value="J" /></td> 
         <td><input name="k" type="button" value="K" /></td> 
         <td><input name="l" type="button" value="L" /></td> 
         <td><input name=";" type="button" value=":" /></td> 
         <td><input name="'" type="button" value='"' /></td>         
        </tr> 
        </table> 
       </div> 
      </td> 
     </tr>    
    </table>   
</div> 

</form> 
</body> 
</html>

上按下的鍵在上代碼，我讓屏幕鍵盤上顯示，並允許用戶只需點擊把鑰匙。當用戶單擊每個文本框時，該鍵盤將自動顯示。JQUERY在每一次事件的內容火災，當我在屏幕鍵盤

首先，我的要求是我想讓我的鍵盤隱藏和重新顯示每當用戶改變聚焦到每個文本框。我的意思是用戶可以瀏覽每個文本框。

當我將注意力放在txtTest1上時，它顯示鍵盤。這是正確的。但是當我按下屏幕鍵盤上的任何按鈕時，屏幕鍵盤消失（隱藏事件火災）。

這是哪裏的問題開始的地方。

所以，請讓我知道在那裏修改我的代碼上任何更好的方式。

來源

2011-09-30 Frank Myat Thu

試試這個：

$(":text").focusout(function() { 
     var $obj = $(document.activeElement, "#row2_shift table" ); 
     if ($obj.length == 0) { 
      $('#keyboard').hide(); 
     } 
    });

來源

2011-09-30 06:09:44

JQUERY在每一次事件的內容火災，當我在屏幕鍵盤

回答

相關問題