Документ JavaScript. Уже не всегда работает, iscroll! - PullRequest
Новая
       29

Документ JavaScript. Уже не всегда работает, iscroll!

3 голосов
/ 22 марта 2011

Здравствуйте, мы создаем мобильное приложение web.app, используя iScroll для прокрутки.Проблема в том, что у скроллера iScroll иногда возникают проблемы при первой загрузке страницы.

Этот код мы добавили (document).ready, чтобы решить проблему, и он делает это в основном, но однажды вкакое-то время это не работает.

Мы предполагаем, что скроллер не работает, когда высота оболочки (области прокрутки) загружается медленно, поэтому мы добавили document.ready срезультаты указаны выше.https://stackoverflow.com/

<script type="text/javascript">

var myScroll;
$(document).ready(function loaded() {
    myScroll = new iScroll('wrapper');
});

$(document).ready.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

$(document).ready.addEventListener('DOMContentLoaded', loaded, false);

</script>`

Будем признательны за помощь!

Спасибо

Ответы [ 5 ]

1 голос
/ 22 марта 2011

ready - это метод, который принимает функцию в качестве параметра и выполняет ее, когда документ ... хорошо готов. поэтому вы должны: 

$(document).ready(function(){
    //do stuff here
});
1 голос
/ 23 марта 2011 
<script type="text/javascript">
    var myScroll;
    setTimeout(function() {
        myScroll = new iScroll('wrapper');
    }, 200);
    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
    document.addEventListener('DOMContentLoaded', loaded, false);
</script>

Является ли решение, которое мы придумали, для всех, кто использует iScroll и в той же ситуации

1 голос
/ 22 марта 2011

$(document).ready(); не следует вызывать так, как вы это делаете после первого вызова. 

$(document).ready.addEventListener

Также похоже, что третий вызов пытается перезаписать его.

Попробуйте сделать следующее. 

var myScroll;
$(document).ready(function {
    myScroll = new iScroll('wrapper');
    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
});
0 голосов
/ 03 апреля 2013

Старый поток, но я думал, что мог бы добавить свои 2 цента, так как сейчас я над этим работаю, и поскольку .bind () устарел в пользу .on () и других забавных вещей: 

var myScroll;
var myScrollObjectID = "wrapper";
$(document).ready(function() {

    setTimeout(function() {
        myScroll = new iScroll(myScrollObjectID);
        console.log("iScroll object set: ", myScroll, myScrollObjectID);
    }, 200);

    $("#" + myScrollObjectID).on("touchmove", function(e){
          e.preventDefault();
          var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
          console.log('document->touchmove', e, touch);

    });  
    console.log("jQuery->document->ready");
});

Конечно, привязка «#wrapper» означает, что мне, возможно, все еще придется иметь дело с событиями touchmove в верхнем и нижнем колонтитулах, которые не контролируются объектом iScroll, но если это так, то я запишу событиена «теле», так как все три элемента «должны» всплыть в объекте тела.

0 голосов
/ 03 мая 2012

Если вы используете jQuery, вам нужно запустить iScroll после загрузки документа.Предпочитаю не использовать встроенный JavaScript, но если вам действительно, действительно нужно, в теге написать: 

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">

$(function(){

$(document).bind('touchmove', function(e){
    e.preventDefault();
});
new iScroll('wrapper');
});

</script>

Таким образом, ничего не произойдет, пока DOM не будет загружен, вы отмените все другие TouchMove.событиями, а затем добавьте функциональность iScroll в ваш div «обертки».

Для div обертки требуются заданные высота и ширина.Первый div внутри оболочки не имеет, но если у него нет заданной высоты, он должен плавать, чтобы браузер мог рассчитать его высоту динамически.

...