2017-08-25 49 views
0

這是一個smiple html表單,我想從它獲取數據並轉換爲xml或以xml格式獲取數據?如何使用JavaScript或jQuery將HTML表單數據保存爲xml格式?

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
    <meta charset="UTF-8"> 
    </head> 
<body> 
    <form action="" method="post"> 
     <p> 
      <label for="firstname">First Name:</label> 
      <input type="text" name="firstname" id="firstname"> 

      <label for="lastName">Last Name:</label> 
      <input type="text" name="lastname" id="lastname"> 

     <button id="submitButton">submit</button> 

    </body> 
</form> 
    </html> 
+4

可能的複製到一個XML文件使用Javascript?](https://stackoverflow.com/questions/11383236/how-to-output-html-form-data-to-a-xml-file-using-javascript) – JRoss

回答

0

如果你想下載就可以使用下面的函數的任何內容的純JavaScript解決方案:

function downloadData(contentType,data,filename){ 

    var link=document.createElement("A"); 
    link.setAttribute("href",encodeURI("data:"+contentType+","+data)); 
    link.setAttribute("style","display:none"); 
    link.setAttribute("download",filename); 
    document.body.appendChild(link); //needed for firefox 
    link.click(); 
    setTimeout(function(){ 
    document.body.removeChild(link); //only to remove the temporal link 
    },1000); 
} 

哪裏的contentType

對於從您可以使用的表單創建XML數據:

function fromToXml(form){ 
    var xmldata=['<?xml version="1.0"?>']; 
     xmldata.push("<form>"); 
    var inputs=form.elements; 
    for(var i=0;i<inputs.length;i++){ 
     var el=document.createElement("ELEMENT"); 
     if (inputs[i].name){ 
     el.setAttribute("name",inputs[i].name); 
     el.setAttribute("value",inputs[i].value); 
     xmldata.push(el.outerHTML); 
     } 

    } 
    xmldata.push("</form>"); 
    return xmldata.join("\n"); 
} 

然後,嘗試按照預期修改格式。

https://jsfiddle.net/jmusfs9v/3/

一個例子,如果你在產生良好的XML輸出從JavaScript可以按照文章intenerested:如何輸出HTML表單數據的http://archive.oreilly.com/pub/h/2127

0

試試這個代碼 -

function getXml(){ 
    var elements = document.forms.myForm.elements; 
    var xmlTemplate = '<?xml version="1.0"?> <formData>'; 
    for(var i =0; i< elements.length; i++){ 
     var element = elements[i]; 
     if(element.tagName=="INPUT"){ 
      xmlTemplate = xmlTemplate + '<'+element.name+'>' + element.value+'</'+element.name+'>'; 
     } 


    } 
    xmlTemplate = xmlTemplate +'</formData>'; 
    return xmlTemplate; 
} 

getXml(); 
相關問題