2016-10-22 4 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, я хочу, чтобы получить файл /tmp/test.html, содержание которого следующим образом

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

Как выполнить функцию 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

Две проблемы остается. –

+0

1. место для сохранения файла –

+0

что я хочу - '/ tmp/test.html', то, что я получаю с кодом, является'/Downloads/_tmp_test.html' –