2013-07-24 49 views
0

我使用JQM。其實我打開彈出按鈕,點選屏幕右下方。我現在面臨一個問題,我對他們上升而進入text.Here是我的代碼..爲什麼在文本字段中輸入文字時會上升?

http://jsfiddle.net/ravi1989/7JqRG/

<div data-role="page" id="Home" > 
     <div data-role="header" data-theme="b" data-position="fixed" data-tap-toggle="false" > 
      <h1 class="ui-title" id="hdr" style="text-align:left;margin-left: 20px;">My Cases</h1> 
      <div class="ui-btn-right" id="headerButtons" data-role="controlgroup" data-type="horizontal"> 
       <a href="#UserSettingScreen" data-transition="none" data-role="button" data-inline="true" data-iconpos="notext" data-icon="gear" data-theme="b" id="Setting" data-rel="popup" data-position-to="window">Setting</a> 
       <a href="#CaseInformationScreen" data-transition="none" data-role="button" data-iconpos="notext" data-inline="true" data-icon="plus" data-theme="b" data-rel="popup" id="Add" data-position-to="window">Add</a> 
       <a href="" data-role="button" data-transition="none" data-inline="true" data-theme="b" data-rel="popup"id="Edit" data-position-to="window">Edit</a> 
      </div> 
     </div> 

     <div data-role="content"> 

      <ul data-role="listview" data-inset="true" id="folderData" > 
      </ul> 
      <!-- **************Case Information Pop up Start*******************--> 
      <div data-role="popup" id="CaseInformationScreen" data-close-btn="none" data-overlay-theme="a" data-dismissible="false"> 
       <div data-role="header" data-theme="b" > 

        <a href="#" data-role="button" data-corners="false" id="Cancel">Cancel</a> 
        <h1>Case Information</h1> 
        <a href="#" data-role="button" data-corners="false" id="AddButton">Add</a> 
       </div> 

       <div data-role="content"> 
        <div><img src="img/Documents.png"/></div> 
        <div data-role="fieldcontain"> 
         <label for="text-12" style="text-align:top;margin-left: 0px;">Case Name:</label> 
         <input name="text-12" id="text-12" value="" type="text" class="caseName_h" autocorrect="off"> 
        </div> 
        <div data-role="fieldcontain"> 
         <label for="caseDate" style="text-align:left;margin-left: 0px;" >Case Date:</label> 
         <input name="caseDate" id="caseDate" value="" type="date" class="caseDate_h" > 
          <!--input name="mydate2" id="mydate2" type="date" data-role="datebox" class="caseDate_h" data-options='{"mode": "calbox","useNewStyle":true,"zindex":1200}'/--> 
        </div> 
        <div data-role="fieldcontain"> 
         <label for="textarea-12">Case Notes :</label> 
         <textarea cols="40" rows="8" name="textarea-12" id="text-12" class="caseTextArea_h" autocorrect="off"></textarea> 
        </div> 
       </div> 
      </div> 

請在標題上加上+按鈕。打開填充文本黑色他們上去?

+0

是U的設備或電腦上的測試呢? – krishgopinath

+0

檢查鉻的小提琴鏈接,它工作正常。 – Sheetal

+0

設備相同的Ipad和平板電腦.. –

回答

0

這裏是你的答案.. window.resize due to virtual keyboard causes issues with jquery mobile

1) Go into jquery.mobile-1.x.x.js 

2) Find $.mobile = $.extend() and add the following attributes: 

last_width: null, 
last_height: null, 
3) Modify getScreenHeight to work as follows: 

getScreenHeight: function() { 
    // Native innerHeight returns more accurate value for this across platforms, 
    // jQuery version is here as a normalized fallback for platforms like Symbian 

    if (this.last_width == null || this.last_height == null || this.last_width != $(window).width()) 
    { 
     this.last_height = window.innerHeight || $(window).height(); 
     this.last_width = $(window).width(); 
    } 
    return this.last_height; 
} 
相關問題