提交ajax表单后iScroll4高度不正确。身高是表单提交前的原始高度

我已将表单嵌入到iScroll4滚动条中。该表单是由wordpress重力表单插件生成的ajax表单。提交ajax表单后iScroll4高度不正确。身高是表单提交前的原始高度

当我点击表单上的提交时，iscroll的高度（在页面加载时生成）保持不变，这意味着如果按下提交按钮后表单较大，则无法一直向下滚动。

见下面我的代码...

var myScroll, 
    myScrollSidebar; 

function loaded() { 
    myScroll   = new iScroll('wrapper'); 
    myScrollSidebar  = new iScroll('sidebar-wrapper'); 
} 

var formInputs = [ 
    document.getElementById('gform_submit_button_1'), 
    document.getElementById('input_1_1'), 
    document.getElementById('input_1_2'), 
    document.getElementById('input_1_3'), 
    document.getElementById('input_1_4'), 
    document.getElementById('input_input_1_5') 
]; 

for(var i = 0; i < formInputs.length; i++) { 
    formInputs[i].addEventListener('touchstart' /*'mousedown'*/, function(e) { 
    e.stopPropagation(); 
    }, false); 
} 

jQuery(document).bind('gform_page_loaded', function(){ 

    var formInputs = [ 
     document.getElementById('gform_submit_button_1'), 
     document.getElementById('input_1_1'), 
     document.getElementById('input_1_2'), 
     document.getElementById('input_1_3'), 
     document.getElementById('input_1_4'), 
     document.getElementById('input_input_1_5') 
    ]; 

    for(var i = 0; i < formInputs.length; i++) { 
     formInputs[i].addEventListener('touchstart' /*'mousedown'*/, function(e) { 
     e.stopPropagation(); 
     }, false); 
    } 

}); 

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false); 
document.addEventListener('DOMContentLoaded', function() { setTimeout(loaded, 200); }, false);

谁能帮我解决这个问题，所以当表单提交，iScroll的高度刷新吧？

绑定的jquery是这样的表单输入工作表单提交后工作。这是因为iscroll4与表单元素的斗争。

在此先感谢。

乔希

来源

2012-02-08 Joshc

您是否尝试过在提交并重新调用'refresh'方法后重新计算表单的高度？ – user850234 2012-06-28 18:44:48

你需要让iScroll计算使用myScroll.refresh（）（你的AJAX之后）的新高度。

这是从开发者的网页（http://cubiq.org/iscroll-4）：

iScroll需要知道包装和滚动两者的正确尺寸。它们是在启动时首次计算的，但如果您的代码更改了元素大小，则需要警告iScroll您正在搞乱DOM。

这是通过在适当的时机调用刷新功能来实现的。请密切关注我，了解这一点将会为您节省数小时的滚动挫折。

每当您更改元素高度/宽度或者以任何方式修改html结构（例如：appendChild或innerHTML）时，浏览器渲染器都会更新页面。一旦浏览器应用了更改，您可以再次从JavaScript访问新的DOM（和属性）。有时候这个过程不是即时的。

来源

2012-09-09 10:31:24

提交ajax表单后iScroll4高度不正确。身高是表单提交前的原始高度

回答

相关问题