2016-01-14 59 views
0

我有一個簡單的html/jscript代碼,它允許用戶輸入一個關鍵字並將示例csv數據(在此代碼中模擬爲var​​ CSV)的結果返回到表格格式在HTML中,現在我希望使用嵌入了CSV的iframe,而不是將我的數據庫引用到此模擬CSV中,我該怎麼做? 此代碼工作正常,但我需要將我的搜索數據庫引用到iframe。 預先感謝您。使用iframe嵌入csv並允許用戶從中搜索

<html> 
<head> 
    <title>CSV Database</title> 
    <script type="text/javascript"> 
     /* Following is a SIMULATED CSV file only.*/ 
     var CSV = 'APRIL,RED,HAPPY,TEACHER,092236015\n'; 
     CSV += 'BRIAN,YELLOW,SAD,ENGINEER,092236015\n'; 
     CSV += 'JIMBOY,BLUE,CRAZY,PROGRAMMER,092236015\n'; 
     CSV += 'JAYCEE,GREEN,MOODY,MAKE-UP_ARTIST,092236015\n'; 
     CSV += 'GALLIE,BLACK,SERIOUS,CYCLIST,092236015\n'; 
    </script> 

</head> 
<body onload="MakeDB()"> 
    Keyword: <input type="text" value="" id="ERP"> 
    <input type="button" value="Search" onclick="CSVsearch(document.getElementById('ERP').value)"> 
    <p> 
    <div id="tblDisplay"></div> 
    <script type="text/javascript"> 

     var DB = new Array(); 
     function MakeDB() { DB = CSV.split('\n'); } 

     function CSVsearch(dbInfo) { 
      var posn = -1; 
      for (i=0; i<DB.length; i++) { 
       tmp = DB[i]; 
       if (tmp.indexOf(dbInfo) != -1) { posn = i; break; } 
      } 
      if (posn == -1) { alert('No matching result from the file'); } 
      else { document.getElementById('tblDisplay').innerHTML = displayAsTable(DB[posn]); } 
     } 

     function displayAsTable(info) { 
      var str = '<table border="1" width="35%">'; 
      var ary = info.split(','); 
      str += '<tr><th>KEYWORD</th><th>INFO1</th><th>INFO2</th><th>INFO3</th><th>INFO4</th></tr>'; 
      str += '<tr><td>'+ary.join('</td><td>')+'</td></tr>'; 
      str += '</table>'; 
      return str; 
     } 
    </script> 
    <br> 
    <br> 
    <br> 
    <br> 
    <br> 
    <iframe src="file:///C:/Users/april_ibanga/Desktop/data.txt" name="data" frameborder="1" scrolling="auto" width="700" height="300" align="bottom"></iframe> 
</body> 
</html> 

回答

0

從我可以告訴,你不能只加載一個iframe中的任何東西,並刮掉它。通常,Javascript會是frameVar.contentWindow,但是當我嘗試將src作爲txt或csv文件時,它爲null。

Web應用程序通常通過Web服務調用來處理此問題,該服務調用返回表示序列化文件內容的html,xml和json響應。

祝你好運!