"вращение"/переключение текста из текстового документа javascript?

Я пытаюсь вытащить текст из текстового документа, а затем разбить его так, чтобы первая часть перед «~» отображалась в одном div, а затем остальная добавляется в другой div, и он отключает текст, чтобы он сначала отобразите первую строку из текстового документа, а затем через 5 секунд она перейдет к строке 2 и т. д., и когда она отобразит последнюю строку, она возвращается к первой строке."вращение"/переключение текста из текстового документа javascript?

Надеюсь, что это имеет смысл. Возможно, это проблема с кодом JSFiddle из-за политики того же происхождения для текстового документа, но я пробовал его на своем сервере, и он тоже не работает.

Что мне здесь не хватает? Пример

Код: JSFiddle

Внутри текстового документа:

0.001TXT~Example text 01 
0.002TXT~Example text 02 
0.003TXT~Example text 03 
0.004TXT~Example text 04 
0.005TXT~Example text 05 
0.006TXT~Example text 06

HTML:

<body> 
    <div id="numbers01">0.000</div> 
    <div id="text01">text</div> 
</body>

Javascript:

$(document).ready(function() { 
    var lines = ""; 
    $.get("http://www.patan77.com/example_text.txt", function (data) { 
     lines = data.split("\n"); 


    }); 
    var i = 0; 
    window.setInterval(function() { 
     if (i <= lines.length) { 
      var line_string = (lines[i]).split("~"); 
      $("#numbers01").html(line_string[0]); 
      $("#text01").html(line_string[1]); 
      i++; 
     } else { 
      i = 0; 
     } 
    }, 5000); 


});

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

источник

2014-02-07 Patrik Fröhler

У меня нет полного ответа, но теперь что-то работает, поскольку по умолчанию JS-вызовы асинхронны, код ниже запускается до того, как данные будут получены. При перемещении кода внутри обратного вызова необходимо исправить вашу первую проблему.

$(document).ready(function() { 
    var lines, i = 0; 

    $.get("http://www.patan77.com/example_text.txt", function (data) { 
     lines = data.split("\n"); 

     window.setInterval(function() { 
      // Index is always in range 
      var line_string = (lines[i]).split("~"); 
      $("#numbers01").html(line_string[0]); 
      $("#text01").html(line_string[1]); 

      // Move this part to only control the index 
      if (i < lines.length) { 
       i++; 
      } else { 
       i = 0; 
      } 
     }, 5000); 

    }); 
});

Так же, это намного лучше, но я не мог заставить его работать. В любом случае, пока он еще не работает ... Я решил перейти к более удобному методу ajax. Я добавил обработчик ошибок ... Я считаю, что сервер, возможно, блокирует запросы ajax, поскольку я получаю пустые тела. Если я загружу url без ajax, он загружает файл.

$(document).ready(function() { 
    var lines, i = 0; 

    $.ajax("http://www.patan77.com/example_text.txt", { 
     dataType: "text", 
     success: function (data) {     
      lines = data.split("\n"); 

      window.setInterval(function() { 
       // Index is always in range 
       var line_string = (lines[i]).split("~"); 
       $("#numbers01").html(line_string[0]); 
       $("#text01").html(line_string[1]); 

       // Move this part to only control the index 
       if (i < lines.length) { 
        i++; 
       } else { 
        i = 0; 
       } 
      }, 5000); 
     }, 
     error: function (xhr, error, errorThrown) { 
      console.log(error + " " + errorThrown); 
     } 
    }); 
});

Поскольку я не могу загрузить данные, я сделал небольшую jsfiddle и издевался данные here

Проблема была расположена на этой линии:

if (i <= lines.length) {

Вместо из

if (i < lines.length) {

источник

2014-02-07 19:54:23

У него нет заголовков CORS. Но ваш код работает. – david

А потом да. Печально, что сообщение об ошибке не ясно. –

Я все еще не могу получить его слишком петля, он добирается до последней строки, затем останавливается –

Поместите весь код внутри обратного вызова $ .get

$(document).ready(function() { 
    $.get("http://www.patan77.com/example_text.txt", function (data) { 
    var lines = data.split("\n"); 
    var i = 0; 
    window.setInterval(function() { 
     if (i <= lines.length) { 
      var line_string = (lines[i]).split("~"); 
      $("#numbers01").html(line_string[0]); 
      $("#text01").html(line_string[1]); 
      i++; 
     } else { 
      i = 0; 
     } 
    }, 5000); 
    }); 
});

В противном случае функция window.setInterval будет вызываться, пока «строки» еще не заполнены из-за асинхронности функции jQuery AJAX.

http://jsfiddle.net/CeLED/3/

источник

2014-02-07 19:55:50 almathie

"вращение"/переключение текста из текстового документа javascript?

ответ

Смежные вопросы