5

我正在创建一个应用程序，我希望在其中输入一个带有一些文本字段的弹出对话框，因此我从 jquery 移动站点中获取了一个示例，并仅插入了 4 个输入文本以插入带有国家和地区代码的固定电话号码。当我在模拟器上运行它时，它会打开弹出对话框，但是当用户尝试在文本框中插入一些内容时，它会在上方滚动，所以我在脚本中使用此代码来禁用页面滚动，如下所示，问题是用户能够仅在 2 个文本框上插入数据，因为其余文本框隐藏在键盘旁边。我想要的是当用户键盘打开并且用户应该能够滚动弹出对话框以插入数据时，页面不应自行滚动。这是我返回的代码：

删除页面...

<div 
    data-role="popup" 
    id="popupDialog" 
    data-overlay-theme="a" 
    data-theme="c" 
    data-dismissible="false" 
    style="max-width:400px;"
    class="ui-corner-all"
>  
    <div data-role="header" data-theme="a" class="ui-corner-top">
        <h1>Delete Page?</h1>
    </div>
    <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content">
        <h3 class="ui-title">Are you sure you want to delete this page?</h3>
        <p>This action cannot be undone.</p>
        <input type='number' id='area code' placeholder='Area code'>
        <input type='number' id='country code' placeholder='Country code'>
        <input type='number' id='numder' placeholder='Number'>
        <input type='button' id='open' data-rel='back' value='OK'>
    </div>
</div>

这是禁用页面滚动的javascript：

$(document)
  .on('popupafteropen', '[data-role="popup"]', function (event, ui) {
    $('body').css('overflow', 'hidden');
  })
  .on('popupafterclose', '[data-role="popup"]', function (event, ui) {
    $('body').css('overflow', 'auto');
  });

提前致谢

4

0 回答 0