Question

您好我收到了像Uncaught ReferenceError这样的错误：在HTMLAnchorElement.onclic中没有定义downloadCSV。请帮我解决这个错误..我正在尝试获取json并将json下载到excel ..这是正确的代码。

<!doctype html>  
<html>  
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
</head>  
<body>
<a href='#' onclick='downloadCSV({ filename: "stock-data.csv" });'>Download CSV</a>

<script type="text/javascript">
$( document ).ready(function() 
{
    $.getJSON('https://www.googleapis.com/youtube/v3/videos?id=ILFc2zlUXHI&key=""&part=snippet,statistics', function(data) {
       var stockData = {"name": "data.items[0].snippet.categoryId" , "id" : "data.items[0].snippet.channelId" , "an" : "data.items[0].snippet.title"};

})

function convertArrayOfObjectsToCSV(args) {
        var result, ctr, keys, columnDelimiter, lineDelimiter, data;

        data = args.data || null;
        if (data == null || !data.length) {
            return null;
        }

        columnDelimiter = args.columnDelimiter || ',';
        lineDelimiter = args.lineDelimiter || '\n';

        keys = Object.keys(data[0]);

        result = '';
        result += keys.join(columnDelimiter);
        result += lineDelimiter;

        data.forEach(function(item) {
            ctr = 0;
            keys.forEach(function(key) {
                if (ctr > 0) result += columnDelimiter;

                result += item[key];
                ctr++;
            });
            result += lineDelimiter;
        });

        return result;
    }

    function downloadCSV(args) {

        var data, filename, link;

        var csv = convertArrayOfObjectsToCSV({
            data: stockData
        });
        if (csv == null) return;

        filename = args.filename || 'export.csv';

        if (!csv.match(/^data:text\/csv/i)) {
            csv = 'data:text/csv;charset=utf-8,' + csv;
        }
        data = encodeURI(csv);

        link = document.createElement('a');
        link.setAttribute('href', data);
        link.setAttribute('download', filename);
        link.click();
    }
    });
</script>  
</body>
</html>

Answer 1

问题是downloadCSV函数位于document.ready（）的旁边，因此无法访问它。

2个选项

将该功能移出文档
在调用该函数的文档中的链接上设置一个侦听器。

即

$('body').on('click','#linkid', function(e){
downloadCSV({ filename: "stock-data.csv" });
});

您为链接指定了linkid的ID

Answer 2

<!doctype html>  
    <html>  
    <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    </head>  
    <body>
    <a href='#' onclick='downloadCSV({ filename: "stock-data.csv" });'>Download CSV</a>

    <script type="text/javascript">

    $( document ).ready(function() 
    {


   });    

    function convertArrayOfObjectsToCSV(args) {
            var result, ctr, keys, columnDelimiter, lineDelimiter, data;

            data = args.data || null;
            if (data == null || !data.length) {
                return null;
            }

            columnDelimiter = args.columnDelimiter || ',';
            lineDelimiter = args.lineDelimiter || '\n';

            keys = Object.keys(data[0]);

            result = '';
            result += keys.join(columnDelimiter);
            result += lineDelimiter;

            data.forEach(function(item) {
                ctr = 0;
                keys.forEach(function(key) {
                    if (ctr > 0) result += columnDelimiter;

                    result += item[key];
                    ctr++;
                });
                result += lineDelimiter;
            });

            return result;
        }

        function downloadCSV(args) {

            var stockData = [];
            var data, filename, link;

            $.getJSON('https://www.googleapis.com/youtube/v3/videos?id=ILFc2zlUXHI&key=""&part=snippet,statistics', function(data) {
                    stockData.push({"name": data.items[0].snippet.categoryId , "id" : data.items[0].snippet.channelId , "an" : data.items[0].snippet.title});

                    var csv = convertArrayOfObjectsToCSV({
                        data: stockData
                    });
                    if (csv == null) return;

                    filename = args.filename || 'export.csv';

                    if (!csv.match(/^data:text\/csv/i)) {
                        csv = 'data:text/csv;charset=utf-8,' + csv;
                    }
                    data = encodeURI(csv);

                    link = document.createElement('a');
                    link.setAttribute('href', data);
                    link.setAttribute('download', filename);
                    link.click();

            });

        }

    </script>  
    </body>
    </html>

javascript函数jquery未捕获引用错误

2 个答案: