Show hide keyboard is not working propery in android phonegap

后端 未结 2 873
耶瑟儿~
耶瑟儿~ 2021-01-15 18:04

i follow this link to use the keyboard event by using [Simon mac donald Defination][1] In that event i show my footer when keyboard hide and hide my footer when keyboard is

相关标签:
2条回答
  • 2021-01-15 18:50

    Remove the .ready() function and add the listeners in the deviceready

    <style type="text/css">
    
    #footer {
        position:absolute;
        bottom:0; left:0;
        width:100%;
        height:7%;
        background-color:#00458D;
        padding:0;
        border-width:3px;
        padding-top:3%;
        padding-bottom:2%;
        padding-right:0px;
        padding-left:0px;
        background-color:#00458D;
    }
    
    #content {
        position:absolute; bottom:0;
        top:0;
        width:100%;
        overflow:auto;
    }
    </style>
    <script type="text/javascript">
    document.addEventListener("deviceready",onDeviceReady,false);
    
        function onDeviceReady () {
            document.addEventListener("hidekeyboard", onHide, false);
            document.addEventListener("showkeyboard", onShow, false);
    
        }
        function onHide() 
        {
            $("#footer").show();
        }
    
        function onShow() 
        {
            $("#footer").hide();
        }
        </script>
    
      </head>
     <body >
        <div id="content">
    
            <input type="text" style="width=70%">
                <br/>
                <br/>
    
            <div id="footer" align="center">
                <table width=100%>
                    <input type="image" src="../images/Home.PNG" style="width:23%" onClick="home()"/>
                    <input type="image" src="../images/messages-menu.jpg" style="width:23%" onClick="inbox()"/>
                    <input type="image" src="../images/settings-menu.jpg" style="width:23%" onClick="settings()"/>
                    <input type="image" src="../images/close-menu.png" style="width:23%" onClick="callServiceFunction()"/>
                </table>
            </div>
        </div>
      </body>
    </html>
    
    0 讨论(0)
  • 2021-01-15 18:57

    Try it in OndeviceReady ()

     $(document).ready(function () 
     {
          document.addEventListener("deviceready", onDeviceReady, false);
     }
     function onDeviceReady()
     {
    
         document.addEventListener("hidekeyboard", onHide, false);
         document.addEventListener("showkeyboard", onShow, false);
    
     }
     function onHide() 
     {
           $("#footer").show();
     }
     function onShow() 
     {
           $("#footer").hide();
     }
    
    0 讨论(0)
提交回复
热议问题