如何在 javascript 函数中的 build html 中编写脚本标记？答案

【问题标题】：How to write script tag inside build html in a javascript function?如何在 javascript 函数中的 build html 中编写脚本标记？
【发布时间】：2017-11-08 07:08:45
【问题描述】：

我正在尝试打开构建 html（内部 js 功能）以在新选项卡上显示表格。现在我正在尝试添加一个 js 函数供用户以 excel 格式下载表格，但是一旦我尝试添加标记代码中断。

我尝试了以下操作：在 js 函数中构建的 html 代码的 script 标签内写了下载函数。添加了一个包含下载 js 功能的新 javascript 文件。在变量中添加下载功能并尝试将其包含在脚本标记中。使用

以下是我的代码：

var myfunction = function download() {
            $("#btnExport").click(function(e) {
                e.preventDefault();

                var data_type = "data:application/vnd.ms-excel";
                var table_div = document.getElementById("table_wrapper");
                var table_html = table_div.outerHTML.replace(/ /g, "%20");

                var a = document.createElement("a");
                a.href = data_type + ", " + table_html;
                a.download = "exported_table_" + Math.floor((Math.random() * 9999999) + 1000000) + ".xls";
                a.click();
            });
        };

        var html='<html><head><title>Locale Value</title><script>'+myfunction+'</script></head>'+
        '<body><h2>'+Header+'</h2><br><br><table>  <tr>    <th>Key</th>    <th>Value</th></tr>';

        for (var key in data) {
            var eachrow = '<tr>'
            + '<td>' + key + '</td>'
            + '<td>' + data[key] + '</td>'
            + '</tr>';
            html=html+eachrow;
        }
        html=html+'</table><br><br><button id="exportExcel" onclick="download()">Export</button></body></html>';
        return html;
    }

这里的问题是只要我关闭脚本标签（即），我的主脚本标签（所有函数都在其中编写）显示为已关闭。同样出现在屏幕上。

【问题讨论】：

你试过onclick="myFunction()"吗？这也不是正确的做法。使用document.createElement('button') 创建按钮，然后使用button.addEventListener 为其添加处理程序。或者你甚至可以做$("#exportExcel").on('click', myFunction)
这可能会有所帮助：stackoverflow.com/questions/20253246/…
我一写我的代码就会中断。如何在我的新 html 代码中包含下载功能？
我已经在下面更新了您的代码检查，问题出在这里：+ myfunction +'' + 'script>'

标签： javascript jquery html jsp

【解决方案1】：

我已经更新了你的代码，请检查：

   $(function () {
    var myfunction = function download() {
        $("#btnExport").click(function (e) {
            e.preventDefault();

            var data_type = "data:application/vnd.ms-excel";
            var table_div = document.getElementById("table_wrapper");
            var table_html = table_div.outerHTML.replace(/ /g, "%20");

            var a = document.createElement("a");
            a.href = data_type + ", " + table_html;
            a.download = "exported_table_" + Math.floor((Math.random() * 9999999) + 1000000) + ".xls";
            a.click();
        });

    var html = '<html><head><title>Locale Value</title><script>' + myfunction + '</' + 'script></head>' +
    '<body><h2>' + Header + '</h2><br><br><table>  <tr>    <th>Key</th>    <th>Value</th></tr>';

    for (var key in data) {
        var eachrow = '<tr>'
        + '<td>' + key + '</td>'
        + '<td>' + data[key] + '</td>'
        + '</tr>';
        html = html + eachrow;
    }
    html = html + '</table><br><br><button id="exportExcel" onclick="download()">Export</button></body></html>';
    return html;
  };
});

【讨论】：

屏幕变为空白，查看控制台后显示：无效或意外令牌 js 代码显示为 html=html+'

即使我的代码是 html=html+'

【解决方案2】：

在字符串中使用“\”。符号“\

【讨论】：