Высота iScroll4 неверна после отправки формы ajax.Высота - это оригинальная высота перед отправкой формы - PullRequest
Новая
       18

Высота iScroll4 неверна после отправки формы ajax.Высота - это оригинальная высота перед отправкой формы

0 голосов
/ 09 февраля 2012

Я встроил форму в свой скроллер iScroll4. Форма представляет собой форму AJAX, созданную плагином Gravity для Wordpress.

Когда я нажимаю кнопку Отправить в форме, высота 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 борется с элементами формы.

Заранее спасибо.

Josh

1 Ответ

1 голос
/ 09 сентября 2012

Вам необходимо заставить iScroll вычислять новую высоту с помощью myScroll.refresh () (ПОСЛЕ вашего AJAX).

Это со страницы разработчика (http://cubiq.org/iscroll-4):

iScroll необходимо знать правильные размеры как оболочки, так и скроллера, они вычисляются при первом запуске, но если ваш код меняет размер элементов, iScroll следует предупредить, что вы связываетесь с DOM.

Это достигается путем вызова функции обновления с правильным временем. Пожалуйста, внимательно следите за мной, понимание того, что это сэкономит вам часы прокрутки.

Каждый раз, когда вы меняете высоту / ширину элементов или изменяете структуру HTMLлюбым способом (например, appendChild или innerHTML) средство визуализации браузера обновляет страницу. Как только браузер применил изменения, вы снова можете получить доступ к новому DOM (и свойствам) из JavaScript. Иногда этот процесс не мгновенный.

...