2015-11-16 19 views
2

我有apache cordova的主要问题。这是一个特定于iOS的问题。我正在使用jQuery-mobile。每当在listview控件上进行搜索时,就会出现问题,然后我的固定位置标题,页脚和搜索输入向下移动。阿帕奇科尔多瓦IOS键盘移动页眉和页脚

这是我的页面的标记。

enter image description here

如果:

<!DOCTYPE HTML> 
<html> 
    <head> 
    <title>Contacts</title> 
    <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" /> 
    <link href="css/jquery.mobile-1.4.5.min.css" rel="stylesheet" /> 
    <link href="css/jquery.mobile.icons.min.css" rel="stylesheet" /> 
    <link href="css/jquery-ui.min.css" rel="stylesheet" /> 
    </head> 
    <body> 
    <style> 
     #my-wrapper 
     { 
     padding-top: 81px; 
     background-color: rgb(250, 246, 246); 
     } 
     #my-wrapper form { 
     position: fixed; 
     left: 2%; 
     right :2%; 
     top: 35px; 
     width: 96%; 
     z-index: 2; 
     background-color: rgb(250, 246, 246); 
     border-color : rgb(120, 120, 120); 
     text-shadow:unset; 
     box-shadow:unset;   
     } 
     #ContactHeader 
     { 
     position: fixed; 
     top: 0px; 
     width: 100%; 
     z-index: 1; 
     } 
    </style> 
    <div id="employeeListPage" data-role="page" > 
     <div id="ContactHeader" data-role="header" style="height:32px ; "> 
     <a class="ui-btn-left" data-icon="arrow-l" href="#" onclick="window.location.replace('index.html');" style="vertical-align:text-top; height:8px"></a> 
     <h2>Contacts</h2> 
     </div> 
     <div id="my-wrapper" data-role="main"> 
     <ul id="employeeList" data-role="listview" data-inset="true" data-filter="true" data-filter-theme="staticscroll" data-filter-placeholder="Search Contacts/Companies" ></ul> 
     </div> 
     <div data-role="footer" style="text-align:center; width: 100%;height: 25px;position:fixed;bottom: 0px;left: 0px;right: 0px;">My footer</div> 
     <div id="loadmoreajaxloader" style="display:none;"><center><img src="css/images/bw-loader.GIF" /></center></div> 
    </div> 
    <script type="text/javascript" src="cordova.js"></script> 
    <script src="js/jquery.js" type="text/javascript"></script> 
    <script src="js/jquery.mobile-1.4.5.min.js"></script> 
    <script src="js/contactlist.js"></script> 
    </body> 
</html> 

当用户开始在任何时候从列表的顶部搜索的搜索栏

$(document).on("pagecreate", "#employeeListPage", function() { 
    $("#employeeList").on("filterablebeforefilter", function (e, data) { 
    var URL = window.localStorage.getItem("ContactsForSearch"); 
    URL = URL + '/' + nextNo + '/' + value; 
    $.getJSON(URL, function (info) { 
     if (info.length === 0) { 
     nomoredata = true; 
     //alert('no more data to display'); 
     $('#employeeList').append('<br>'); 
     $('#employeeList').append('<center><h2>No Data <h2> </center>'); 
     } 
     else { 
     $('#employeeList').append('<li style="border-top: 1px solid #0189D0;"><a data-transition="slide" href="employeedetails.html?id=' + id + '&comnum=' + comNum + '&contactNum=' + contactNumber + '"><h2>' + companyName + '</h2> <small>' + name + ' - ' + designation + '</small>' + '</a>' + '</li>'); 
     } 
    }); 
    }); 
}); 

打字我也有一个事件,火灾你正在向下滚动,然后你开始在搜索栏中输入,发生这种情况......这些屏幕截图是从xcode的模拟器中获取的,在手机上它具有相同的结果它除了T具有键盘在底部弹出:

enter image description here

+0

我有同样的问题 –

回答

0

这与滚动标题解决的问题:

if (window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
     cordova.plugins.Keyboard.disableScroll(true); 
    } 

不幸的是它消除了“完成”按钮呢! !

+0

我认为这是Ionic键盘插件? – DarkNeuron

相关问题