html如何将输入文本框的内容进行导出

img
添加什么代码啊
功能加上一个保存按钮,实现保存功能,最好是能够导出来

你自己耍来玩可以保存到localStorage中,但是不能和其他用户和浏览器共享数据,要共享数据需要搭建web服务器保存到数据库中

导出可以通过blob导出,示例代码如下,有帮助麻烦点个采纳【本回答右上角】,谢谢~~

<form>
    <input id="txt" />
    <input type="submit" id="submit" value="保存" />
    <input type="reset" value="清空" />
    <input type="button" id="export" value="导出" />
</form>
<script>
    var txt = document.getElementById('txt');
    var s = localStorage.getItem('value') || '';
    txt.value = s;
    document.querySelector('#submit').onclick = function () {
        localStorage.setItem('value', txt.value);
        alert('保存成功,刷新页面值还存在!')
        return false;
    }

    document.querySelector('#export').onclick = function () {
        var data = new Blob([txt.value]);
        var a = document.createElement('a');
        a.href = URL.createObjectURL(data);
        a.download = '要保存的文件名.txt';
        a.click();
        return false;
    }

</script>

这个得借助后端了吧。前端很难做到读写文件。并导出。前端需要把值传过去。后端,则存入到一个文件,并返回一个文件流地址

想要持久的保存数据,需要连接数据库,
否则就算保存到了页面刷新一下就没了

请采纳

支持多浏览器 ie最方便使用document.execCommand 就好了 其余浏览器要做判断 使用超链接下载


<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <textarea name="wenben" id="wenben" cols="100" rows="10">000</textarea>
        <input type="button" value="Save" onclick="saveText()">
    </body>
    <script>
        function saveText(obj) {
            obj = document.getElementById("wenben")
            if (isIE()) {
                //IE浏览器保存文本框内容 

                var winSave = window.open();
                winSave.document.open("text", "gb2312");
                winSave.document.write(obj.value);
                winSave.document.execCommand("SaveAs", true, "newfile.txt");
                window.location.href = "#";
                winSave.close();
            } else {
                saveAs(obj, 'newfile.txt');
            }
        }

        function saveAs(obj, filename) {
            //chrome,火狐等现代浏览器保存文本框内容 
            var a = document.createElement('a');
            a.setAttribute('href', 'data:text/html;gb2312,' + obj.value);
            a.setAttribute('download', filename);
            a.setAttribute('target', '_blank');
            a.style.display = "none";
            obj.parentNode.appendChild(a);
            a.click();
        }

        //判断浏览器类型
        function isIE() {
            if (!!window.ActiveXObject || "ActiveXObject" in window) return true;
            else return false;
        }
    </script>
</html>

在html5中有个FileWrite 你可以去看看。