2016-10-22 20 views
0

saveTable関数の記述方法は?

function createTable(){ 
 
    var _table = document.getElementById("test"); 
 
    var newRow = _table.insertRow(1); 
 
    var cell0 = newRow.insertCell(0); 
 
    var cell1 = newRow.insertCell(1); 
 
    cell0.innerHTML = "x"; 
 
    cell1.innerHTML = 60; 
 
    } 
 

 
function saveTable(){ 
 
    document.execCommand("saveas",,"/tmp/test.html"); 
 
    }
<p>to create my table</p> 
 
<input type="button" value="to create new table" onclick="createTable()" /> 
 
<input type="button" value="to save table as /tmp/test.html" oncilck="saveTable()" /> 
 
<table id="test" bodrder=1px> 
 
<tr> 
 
    <td>f1</td> 
 
    <td>f2</td> 
 
</tr> 
 
</table>

テーブルは、関数のcreateTableによって作成されたとき、私は

<table id="test"> 
 
<tr> 
 
<td>f1</td> 
 
<td>f2</td> 
 
</tr> 
 
<tr> 
 
<td>x</td> 
 
<td>60</td> 
 
</tr> 
 
</table>

を次のようにその内容であるファイル/tmp/test.htmlを取得したいです仕事をするためにsaveTable関数を実行する方法は?

答えて

1

ここで説明したようにあなたがこのためにブロブを使用することができます。

https://thiscouldbebetter.wordpress.com/2012/12/18/loading-editing-and-saving-a-text-file-in-html5-using-javascrip/

、ここで:

How to export source content within div to text/html file

<!DOCTYPE html> 
 

 
<html> 
 
<head> 
 

 
    
 
    <title></title> 
 
</head> 
 

 
<body> 
 
    <p>to create my table</p> 
 

 
    <form> 
 
    <input type="button" value="to create new table" onclick="createTable()"> <input type="button" value= 
 
    "to save table as /tmp/test.html" onclick="saveTable()"> 
 
    </form> 
 

 
    <table id="test" bodrder="1px"> 
 
    <tr> 
 
     <td>f1</td> 
 

 
     <td>f2</td> 
 
    </tr> 
 
    </table> 
 
    
 
    
 
    <script> 
 
function createTable() { 
 
\t var _table = document.getElementById("test"); 
 
\t var newRow = _table.insertRow(1); 
 
\t var cell0 = newRow.insertCell(0); 
 
\t var cell1 = newRow.insertCell(1); 
 
\t cell0.innerHTML = "x"; 
 
\t cell1.innerHTML = 60; 
 
} 
 

 
function saveTable() { 
 
\t var textToSave = document.getElementById("test").outerHTML; 
 
\t var textToSaveAsBlob = new Blob([textToSave], { 
 
\t \t \t type : "text/html" 
 
\t \t }); 
 
\t var textToSaveAsURL = window.URL.createObjectURL(textToSaveAsBlob); 
 
\t var fileNameToSaveAs = "/tmp/test.html"; 
 

 
\t var downloadLink = document.createElement("a"); 
 
\t downloadLink.download = fileNameToSaveAs; 
 
\t downloadLink.innerHTML = "Download File"; 
 
\t downloadLink.href = textToSaveAsURL; 
 
\t downloadLink.onclick = destroyClickedElement; 
 
\t downloadLink.style.display = "none"; 
 
\t document.body.appendChild(downloadLink); 
 

 
\t downloadLink.click(); 
 
} 
 

 
function destroyClickedElement(event) { 
 
\t document.body.removeChild(event.target); 
 
} 
 

 
    </script> 
 

 
    
 
</body> 
 
</html>

+0

2つの問題を残っている。 –

+0

1.ファイルを保存する場所 –

+0

私が望むものは '/ tmp/test.html'です。コードとは'/Downloads/_tmp_test.html'です。 –

関連する問題