2016-07-26 2 views
0

페이지가로드 될 때마다 임의 캡션을로드하려고합니다. 별도의 텍스트 파일이 있고 각 줄에 문자열이 들어 있습니다. 나는 HTML과 Javascript에 익숙하지 않다.Javascript를 사용하여 텍스트 파일에서 임의 캡션로드 및

HTML :

<div class="centerpiece"> 
       <h1>DEL NORTE BANQUEST</h1> 
       <p class="caption"><script src = "js/caption.js"></script><script>getCaption();</script></p> 
       <a class="btn" id="browse-videos-button" href="#video-list">Browse Videos<br><img src="img/arrow-down.svg"style="width:15px;height:15px;"></a> 
      </div> 

자바 스크립트 : 소스 파일에서

function getCaption() 
{ 
    var txtFile = "text/captions.txt" 
    var file = new File(txtFile); 
    file.open("r"); // open file with read access 
    var str = ""; 
    var numLines = 0; //to get the range of lines in the file 
    while (!file.eof) 
    { 
     // read each line of text 
     numLines += 1; 
    } 
    file.close(); 
    file.open("r"); 
    var selectLine = Math.getRandomInt(0,numLines);//get the correct line number 
    var currentLine = 0; 
    while(selectLine != currentLine) 
    { 
    currentLine += 1; 
    } 
    if(selectLine = currentLine) 
    { 
    str = file.readln(); 
    } 
    file.close(); 
    return str; 
} 

텍스트 :

We talked yesterday 
Freshman boys! 
5/10 
I'm having a heart attack *pounds chest super hard 

이 사이트는 텍스트 파일이 혼란했다 경우 내 고등학교 크로스 컨트리 팀이다 .

대부분의 구문에 익숙하지 않아 어떻게 든 다시 설정해야하는 경우 루프를 통해 파일을 반복하여 볼 수 없으므로 파일을 두 번 닫고 두 번 닫았습니다. 다음은 변경하려고하는 특정 캡션의 jsfiddle과 자바에서의 내 기능입니다.

https://jsfiddle.net/7cre9qqj/

당신은 내가 알고 당신이 가질 수있는 비판이 엉망처럼 보이는 경우 주저하지 말아 주시기 바랍니다 주시기 바랍니다 작동하도록 더 많은 코드가 필요한 경우

, 나는 결국 배우려고 노력하고 있어요! 도와 줘서 고마워!

답변

0

File API클라이언트 쪽의 파일 시스템에 액세스 할 수 있으므로 수행하려는 작업에 실제로 적합하지 않습니다. 또한 매우 특정한 상황에서만 사용할 수 있습니다.

간단한 해결책은 AJAX 요청을 실행하여 견적을 채우는 것입니다. AJAX 호출은 서버의 파일을 읽을 수 있으며 파일의 내용을 줄 단위로 나누고 표시 할 임의의 줄을 선택하는 것이 간단합니다. jQuery에 익숙하기 때문에 코드는 매우 간단합니다.

$.get("text/captions.txt")).then(function(data) { 
    var lines = data.split('\n'); 
    var index = Math.floor(Math.random() * lines.length); 
    $("#quote").html(lines[index]); 
}); 

다음은 전체를 보여주는 바이올린입니다. 실행될 때마다 무작위 따옴표가로드 될 것입니다. https://jsfiddle.net/s1w8x4ff/

+0

@EvanJameson이 방법이 작동하는지 또는 더 자세한 정보가 필요하면 알려주십시오 – dave

관련 문제