Question

使用jQueryMobile和iscrollview插件，我无法向下滚动包含动态添加内容的页面。这是我的HTML：

<div data-role="content" class="care-plan-fields"  id="scroll-wrapper" data-iscroll>

                <div data-role="fieldcontain" id="field1">
                    <label for="field1Text" id="field1Label"></label>
                    <textarea cols="40" rows="2" id="field1Text" spellcheck="true" autocorrect="on" autocapitalize="on"></textarea>
                </div>


                <div data-role="fieldcontain">
                    <label for="field2Text" id="field2Label"></label>
                    <textarea cols="40" rows="2" id="field2Text" spellcheck="true" autocorrect="on" autocapitalize="on"></textarea>
                </div>


                <div data-role="fieldcontain">
                    <label for="field3Text" id="field3Label"></label>
                    <textarea cols="40" rows="2" id="field3Text" spellcheck="true" autocorrect="on" autocapitalize="on"></textarea>
                </div>


                <div data-role="fieldcontain" id="field4">
                    <label for="field4Text" id="field4Label"></label>
                    <textarea cols="40" rows="2" id="field4Text" spellcheck="true" autocorrect="on" autocapitalize="on"></textarea>
                </div>

            </div>

我在 pagebeforeshow 处理程序中将数据添加到textareas，如下所示：

$("label[for='field1Text']").text(carePlan.fields[0].label);
$('#field1Text').val(carePlan.fields[0].text);

然后立即在滚动视图上调用refresh以使其调整大小：

$('#scroll-wrapper').iscrollview("refresh");

然而，虽然textareas已经调整大小以适应添加到它们的文本的大小，但页面似乎没有调整大小，如果添加的数据超出页面底部，我无法向下滚动。

如果我离开页面然后再返回，我可以完全向下滚动。

我认为这是一些渲染问题，并且无法弄清楚如何重新渲染页面而不再向后导航。（注意iscrollview插件适用于我的应用程序中的其他列表视图，但它们没有像这样动态添加的数据。）有人有主意吗？干杯

Answer 1

那些其他列表视图是否也是页面的主要内容div？

可能iscroll与jquery移动布局设置冲突 - 内容div调整大小以适应jquery mobile的内容，然后iscroll将其作为可用的屏幕区域，即使它实际上并非全部可见。内容div附带的开箱即用滚动也不会生效，因为iscroll正在捕捉所有触摸事件。

jQueryMobile无法向下滚动到动态创建的页面内容

1 个答案: