Android 上的 JQueryMobile：视口调整为 Listview 中的 Textsize答案

【问题标题】：JQueryMobile on Android: Viewport adjusts to Textsize in ListviewAndroid 上的 JQueryMobile：视口调整为 Listview 中的 Textsize
【发布时间】：2012-10-22 21:47:44
【问题描述】：

我的问题出现在与 JQuery Mobile 结合使用的内部 Android 浏览器上。当我重新加载当前页面时，内容会缩小以适应列表视图中的文本。

更详细： 该代码在 iPhone、移动桌面工具和 Androids Firefox 上运行良好。然而，在内部 Android 浏览器上，我对下面的代码有这个奇怪的问题。请参阅下面的编辑。

到目前为止我所做的尝试： 我用视口元标记玩了很多。无论如何，我认为这不是问题所在，因为内容在我的应用中的所有其他网站上都会正确显示。

<meta name='viewport' content='width=device-width,initial-scale=1,maximum-scale=1'>

$('meta[name=viewport]').attr('content','width='+$(window).width()+',user-scalable=no');

喜欢这些帖子建议：

我的代码：

<html>
    <head>
        <meta name="viewport" content="width=650">
        <!-- CSS and Scripts-->
    </head>
    <body>
        <!-- Page Wrapper -->
        <div data-role="page">

            <section data-role="content">
                <h2>
                   Code Sample
                </h2>

                <div class="ui-grid-solo">
                    <p style="margin-bottom: 38px;">
                        <a href="?id=a" data-ajax="false">A</a>
                        <a href="?id=b" data-ajax="false">B</a>
                        <a href="?id=c" data-ajax="false">C</a>
                    </p>


                </div>

                <!-- Dynamic content-->
                <ul data-role="listview" data-inset="false">
                    <!-- Use ?id to grab and display data (CodeBehind.vb)-->
                </ul>            

            </section>   

        </div>                 
    </body>
</html>

有没有人有想法，或者遇到过类似的问题？

编辑： 我正在做一些事情，问题似乎发生在这种代码和平中：

<!-- Dynamic content-->
<ul data-role="listview" data-inset="false">
    <!-- Use ?id to grab and display data (CodeBehind.vb)-->
</ul>

通常，listView 会替换为末尾带有“dot dot dot”的大文本项目，以便它们适合屏幕。在我的情况下，它仍然会这样做，但是在缩短发生之前，文本有很多字符。结果是，一切都缩小了。我该如何解决这个问题？

【问题讨论】：

标签： android listview mobile jquery-mobile viewport

【解决方案1】：

由于我没有得到关于这个问题的答案，我发布了我的修复：

仅在移动 Safari 浏览器上，listView 项目似乎没有缩短。现在我正在调用一个在pageinit 上手动执行此操作的函数：

    fixListView: function () {
        var brokenAgent = "Safari";
        var currentUserAgent = navigator.userAgent;
        if (currentUserAgent.indexOf(brokenAgent) != -1) {
            var listItemList = $('.long-text');
            for (var i = 0; i < listItemList.length; i++) {
                var text = listItemList[i].innerText;
                if (text.length > 40) {
                    var newText = text.substr(0, 40);
                    listItemList[i].innerText = newText + "...";
                }
            }
        }
    }

对我的修复仍然不满意，欢迎任何改进意见！

【讨论】：