Json 对象到 HTML 表答案

【问题标题】：Json Object to HTML tableJson 对象到 HTML 表
【发布时间】：2014-02-24 08:05:27
【问题描述】：

当我按下按钮时，我有一个带有“按钮/链接”的简单页面，我需要调用 github api 来返回记录在我的存储库中的所有问题并以表格格式显示。

但是当我点击链接时什么都没有发生..

   <html>
<head>

    <script src="json-to-table.js"></script>
    <script src="js/jquery-1.10.2.min.js"></script>
    <script src="script.js"></script>
    <script src="script.responsive.js"></script>

</head>
<body>

    <h2>All Issues</h2>
    <a href="#" id="ghsubmitbtn" class="art-button">VIEW</a>

    <div id="ghapidata" class="clearfix">

<script type="text/javascript">

    $(function() {
        $('#ghsubmitbtn').on('click', function(e) {
            e.preventDefault();
            $('#ghapidata').html('<div id="loader"><img src="css/loader.gif" alt="loader..."></div>');

            var ghissues = 'https://api.github.com/repos/stroes/stroestest/issues';

            requestJson(ghissues, function(json) {
                if(json.message == "Not Found") {
                    $('#ghapidata').html("<h2>No Issues found in this repository</h2>");
                }

                else {
                    var jsonHtmlTable = ConvertJsonToTable(ghissues, 'jsonTable', null, 'Download');

                }

            }
        }
    });





</script>

    </div>
</body>
</html>

谁能指出我的代码哪里出错了

【问题讨论】：

你能发一个 jsfiddle 并附上所有的代码吗？

标签： javascript jquery json jscript github-api

【解决方案1】：

您的脚本在您的 div 标签内。当您更改其中的 html 时，整个脚本将被删除。尝试将脚本放在 div 标签之外。

<html>
<head>
<script src="json-to-table.js"></script>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="script.js"></script>
<script src="script.responsive.js"></script>

</head>
<body>

<h2>All Issues</h2>
<a href="#" id="ghsubmitbtn" class="art-button">VIEW</a>

<div id="ghapidata" class="clearfix"></div>

<script type="text/javascript">

 $(function() {
    $('#ghsubmitbtn').on('click', function(e) {
        e.preventDefault();
        $('#ghapidata').html('<div id="loader"><img src="css/loader.gif" alt="loader..."></div>');

        var ghissues = 'https://api.github.com/repos/stroes/stroestest/issues';

        requestJson(ghissues, function(json) {
            if(json.message == "Not Found") {
                $('#ghapidata').html("<h2>No Issues found in this repository</h2>");
            }

            else {
                var jsonHtmlTable = ConvertJsonToTable(ghissues, 'jsonTable', null, 'Download');

            }

        }
    }
});

【讨论】：

【解决方案2】：

您应该会在控制台中看到错误。你没有正确关闭函数

$(function () {
    $('#ghsubmitbtn').on('click', function (e) {
        e.preventDefault();
        $('#ghapidata').html('<div id="loader"><img src="css/loader.gif" alt="loader..."></div>');

        var ghissues = 'https://api.github.com/repos/stroes/stroestest/issues';

        requestJson(ghissues, function (json) {
            if (json.message == "Not Found") {
                $('#ghapidata').html("<h2>No Issues found in this repository</h2>");
            } else {
                var jsonHtmlTable = ConvertJsonToTable(ghissues, 'jsonTable', null, 'Download');

            }

        });
    });
});

【讨论】：

【解决方案3】：

请再看这里

    var jsonHtmlTable = ConvertJsonToTable(ghissues, 'jsonTable', null, 'Download');

第二个参数需要你的表的id你没有id为jsonTable的表我认为这是问题

【讨论】：