텍스트 파일의 내용을 10 초마다 다시로드하십시오.

다음 코드를 사용하여 사용자가 텍스트 파일을 선택한 다음 내용을 아래 PRE 태그에로드합니다. 텍스트 파일의 내용을 10 초마다 다시로드하십시오.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
    <head> 
 
    <title>Load text file</title> 
 
    <script type="text/javascript"> 
 
\t \t function readText(that){ 
 
\t \t \t if(that.files && that.files[0]){ 
 
\t \t \t \t var reader = new FileReader(); 
 
\t \t \t \t reader.onload = function (e) { 
 
\t \t \t \t \t var contents = e.target.result;//.replace("\r\n","<br/>"); 
 
\t \t \t \t \t contents = contents.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'); 
 
\t \t \t \t \t document.getElementById('board').innerHTML= contents; 
 
\t \t \t \t };//end onload() 
 
\t \t \t \t reader.readAsText(that.files[0]); 
 
\t \t \t }//end if html5 filelist support 
 
\t \t } 
 
    </script> 
 
    </head> 
 
    <body> 
 

 
<input type="file" onchange='readText(this)' /> <hr /> 
 

 
<pre id="board" contenteditable = "true"> 
 
This is where the text from the chosen text file will be loaded. 
 
</pre> 
 

 
</body> 
 
</html>

는 10 초마다 선택한 파일의 내용을 읽을 수 있습니까?

예를 들어 사용자가 텍스트 파일을 선택합니다 (한 번). 그런 다음 코드는 루프를 반복하여 내용을 다시 읽고 텍스트 파일에 적용된 모든 변경 사항으로 PRE 태그를 업데이트합니다.

로컬로 작업 중이므로 어떤 서버 스크립팅도 불가능합니다.

솔루션에 SETINTERVAL이 (가) 포함될 수 있다는 느낌이 들었습니까?

감사합니다.

출처

2017-04-05 jmcall10

setInterval을 사용하지 않는 이유는 무엇입니까? –

작동시킬 수 있습니까? – jmcall10

변경된 경우 업데이트 된 내용을 얻기 위해 업로드 된 파일의 내용을 10 초마다 다시 읽으려고합니까? –

당신은

// A variable to store the id of the setInterval method 
var currentIntervalId = undefined; 
// The function that calls your method. 
var startOrRestart = function(that) { 
    // Clear the 'old' calls to avoid wrong behavior 
    if (currentIntervalId !== undefined) clearInterval(currentIntervalId); 
    readText(that); // For executing immediately 
    // Execute it readText each 10 seconds 
    currentIntervalId = setInterval(function() { readText(that); }, 10000); 
};

하여 입력 태그의

는이 솔루션의 아이디어

<input type="file" onchange='startOrRestart(this)' />

를 호출하면 한 번 READTEXT (즉) 기능을 실행할 것입니다 각 10 후 사용할 수 있습니다 초 (setInverval 기능 사용). 그러나 텍스트가 변경되면 setInterval 함수가 다시 실행됩니다. 따라서 '오래된'입력을 처리하는 오래된 트리거가 있습니다. 당신은 새로운 입력을위한 새로운 '방아쇠'를 가지고 있습니다. 이러한 바람직하지 않은 동작을 피하기 위해 우리는 트리거의 ID를 저장하고 설정된 경우 트리거를 종료합니다.

출처

2017-04-05 07:46:46 Guybrush

안녕하세요, 감사합니다. 그러나이 코드는 작동하지 않습니다. 좀 더 도움을 줄 수 있습니까? 감사합니다 – jmcall10

스크립트 태그에 자바 스크립트를 넣으십시오. 또한 _onchange = 'readText (this)'_ _onchange = 'startOrRestart (this)'_로 전환하십시오. 오류 출력이 있습니까? – Guybrush

처음에는 본문에 새 스크립트 태그를 만들었지 만 원래 스크립트 태그에 JS를 붙여 넣고 onchange를 변경했습니다. chrome에서는 작동하지만 IE 나 FF에서는 작동하지 않습니다. – jmcall10

텍스트 파일의 내용을 10 초마다 다시로드하십시오.

답변

관련 문제