Блог

Главная - Вопросы по программированию - Загрузите текстовую область формы в виде XML-файла. Работает в IE10, но не в Chrome35 или Firefox30

Загрузите текстовую область формы в виде XML-файла. Работает в IE10, но не в Chrome35 или Firefox30

#javascript #html #xml #cross-browser

#javascript #HTML #xml #кросс-браузерный

Вопрос:

Пытаюсь создать кнопку (или ссылку) для загрузки данных из текстовой области HTML-формы и сохранения в виде XML-файла. Я мог бы объяснить почему, но это займет целую вечность.

Вот мой рабочий (только в IE10) текстовый пример. Я бы хотел, чтобы это работало и в Chrome, и в Firefox, но пока не повезло, есть идеи?

Мне не нужно ничего особенного, просто добавьте данные в переменную, поместите переменную в новый файл и запросите SaveAs filename.xml 

 <html>

<head>
<script lang="javascript">
function download(){
     var xmlContent = document.getElementById("Kitchen").innerHTML; //here we load our xml data 
     var blob = new Blob([xmlContent], {
         type: "text/xml;charset=utf-8;"
     });
    navigator.msSaveBlob(blob, "SaveAsYourFileNameHere.xml");
}
</script>
</head>

<body style="background-color: rgb(225,225,225)">
<br>
<form id="House">
  <textarea id="Kitchen"cols="20" rows="10">This is the Kitchen</textarea>
</form>
<br>
<a href="#" onClick="download()">Download Xml</a><br>
<br>
</body>

</html>

Ответ №1:

Blob работает только в IE, для FF и Chrome посмотрите URI данных

https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs

Что-то вроде:

 <script type="text/javascript">
        function base64_encode(data) {
            //  discuss at: http://phpjs.org/functions/base64_encode/
            // original by: Tyler Akins (http://rumkin.com)
            // improved by: Bayron Guevara
            // improved by: Thunder.m
            // improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
            // improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
            // improved by: Rafa? Kukawski (http://kukawski.pl)
            // bugfixed by: Pellentesque Malesuada
            //   example 1: base64_encode('Kevin van Zonneveld');
            //   returns 1: 'S2V2aW4gdmFuIFpvbm5ldmVsZA=='
            //   example 2: base64_encode('a');
            //   returns 2: 'YQ=='

            var b64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 /=';
            var o1, o2, o3, h1, h2, h3, h4, bits, i = 0,
                    ac = 0,
                    enc = '',
                    tmp_arr = [];

            if (!data) {
                return data;
            }

            do { // pack three octets into four hexets
                o1 = data.charCodeAt(i  );
                o2 = data.charCodeAt(i  );
                o3 = data.charCodeAt(i  );

                bits = o1 << 16 | o2 << 8 | o3;

                h1 = bits >> 18 amp; 0x3f;
                h2 = bits >> 12 amp; 0x3f;
                h3 = bits >> 6 amp; 0x3f;
                h4 = bits amp; 0x3f;

                // use hexets to index into b64, and append result to encoded string
                tmp_arr[ac  ] = b64.charAt(h1)   b64.charAt(h2)   b64.charAt(h3)   b64.charAt(h4);
            } while (i < data.length);

            enc = tmp_arr.join('');

            var r = data.length % 3;

            return (r ? enc.slice(0, r - 3) : enc)   '==='.slice(r || 3);
        }

        var str="Hi my name is Adam and I love Javascript";
        var str64=base64_encode(str);
        var a = document.createElement('a');
        if(window.navigator.msSaveOrOpenBlob){
            var fileData = str;
            blobObject = new Blob([str]);
            a.onclick=function(){
                window.navigator.msSaveOrOpenBlob(blobObject, 'MyFile.csv');
            }
        }else{
            a.setAttribute('href','data:text/csv;headers=Content-Disposition: attachment; filename="with spaces.csv"
Content-Language: en,√;base64,'   str64,'MyFile.csv');
        }
        a.appendChild(document.createTextNode('Click to Download'));
        document.body.appendChild(a);
    </script>