2016-04-25 14 views
2

私はPhoneGapを使用して新しいアプリを作成しています。 キーボードイベントを使用する必要があり、動作させることができません。 Android搭載端末でのみテストしています。ionic-plugin-keyboard not working

私はそれに関する他のすべての質問を読みましたが、提案された解決策のどれも私にとっては効果がありません。 私は今この特定の問題を解決しようとしているかなり単純なプロジェクトを作成しました。

アイデアは:私は入力してボックスを持っています。デバイスの準備ができたら、ボックスの色を変更します(これは機能します)。入力をクリックするとキーボードが表示され、ボックスの色を変更したいのですが、キーボードを閉じると再び色を変更したいのです。

マイHTML

 <head> 
      <meta charset="utf-8" /> 
      <meta name="format-detection" content="telephone=no" /> 
      <meta name="msapplication-tap-highlight" content="no" /> 

      <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> 

      <link rel="stylesheet" type="text/css" href="css/index.css" /> 
      <link rel="stylesheet" type="text/css" href="css/style.css" /> 

      <script type="text/javascript" charset="utf-8" src="cordova.js"></script> 

     </head> 

     <body> 

       <form><input type="number" name="amount"></form> 
       <div id="box"></div> 


       <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
       <script type="text/javascript" src="js/index.js"></script> 
       <script type="text/javascript" src="js/main.js"></script> 


       <script type="text/javascript">app.initialize(); 
       </script> 
      </body> 

これは私のmain.jsです。 devicereadyイベントはデバイスで正しく機能し、ボックスの色を変更します。

<plugin name="com.ionic.keyboard" source="pgb" /> 

私もindex.htmlをが、私のコードを追加しようとしました。しかし、何についてのhidekeyboardshowkeyboard

if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry)/)) { 
     document.addEventListener("deviceready", onDeviceReady, false); 
    } else { 
     onDeviceReady();} 

function onDeviceReady(){ 
     $('#box').css({'background-color': 'red'}); 
     document.addEventListener("hidekeyboard", onHide, false); 
     document.addEventListener("showkeyboard", onShow, false);} 

function onHide() { 
     $('#box').css({'background-color': 'green'}); } 

function onShow() { 
     $('#box').css({'background-color': 'black'}); } 

私はconfig.xmlのにこの行を追加していません動作しなかったので削除しました。

ありがとうございます!代わりにあなたのkeyboardhideとkeyboardshowイベントリスナの

答えて

0

てみ

native.keyboardshow native.keyboardhide