【问题标题】:jQuery mobile iscroll view : Cannot type in text box properlyjQuery mobile iscroll 视图:无法正确输入文本框
【发布时间】:2013-08-22 06:57:31
【问题描述】:

在我的 jquery mobile ios phonegap 应用程序中,我使用 iscroll。在使用 iscroll 时,文本框的行为很奇怪(在输入每个字符时上下移动)。

我在我的应用中启用了 iscroll,

添加了以下脚本:

 <script src="js/iscroll.js"></script>
 <script src="js/jquery.mobile.iscrollview.js"></script>

我的页面看起来像,

 <div data-role="page" id="index">
    <div data-theme="a" data-role="header" data-position="fixed" data-id="footer" data-tap-toggle="false" data-transition="none">
    </div>
    <div data-role="content" data-iscroll>
      // following text field works weirdly 
      <input id="txtComment" placeholder="COMMENTS" value="" type="text" data-theme="b"/>  

    </div>
    <div data-role="navbar" data-position="fixed" data-theme="a" data-id="footer" data-tap-toggle="false" data-transition="none">
    </div>
 </div>

我尝试添加以下代码,但没有成功

 var selectField = document.getElementById('txtComment');
 selectField.addEventListener('touchstart', function(e) {
      e.stopPropagation();
 }, false);

我该如何解决?

请帮忙。

【问题讨论】:

    标签: jquery-mobile textbox iscroll iscrollview


    【解决方案1】:

    将此功能与 iscroll 一起使用,您可以在表单字段中输入.....

    <script type="text/javascript">
    
        var myScroll;
        function loaded() {
            myScroll = new iScroll('wrapper', {
                useTransform: false,
                onBeforeScrollStart: function (e) {
                    var target = e.target;
                    while (target.nodeType != 1) target = target.parentNode;
                    if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA')
                        e.preventDefault();
                    }
                });
            }
    
        document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
        document.addEventListener('DOMContentLoaded', loaded, false);
    
    </script>
    

    【讨论】:

    • 实际上我在内容 div 中使用 data-iscroll,在标头中使用 data-tap-toggle="false" data-transition="none" 来固定标头。 iscroll 在内容 div 中初始化(不像你提到的那样)。
    【解决方案2】:

    试试:

    在 Android Manifest 活动中:android:windowSoftInputMode = "adjustNothing"

    【讨论】:

      【解决方案3】:

      我遇到了同样的问题。只需使用

      刷新您的滚动条

      setTimeout(function () { myScroll.refresh(); }, 1000);

      通过在正确的位置添加刷新,您可以解决这个问题。我浏览了许多网站并尝试了很多。它完美地工作了我。

      如果它不起作用,那么它的移动版本(android,ios)问题,因为滚动 deos 不支持。 希望对你有帮助。

      【讨论】:

      • @Erma Isabel : 我能知道你在哪个手机上测试过..?你的问题解决了吗..?
      猜你喜欢
      • 1970-01-01
      • 2012-10-20
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-11-24
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多