为什么我的 jQuery 生成的列表项不显示？

Question

我有一个名为 Platypus.XML 的 XML 文件，我已将它添加到我的 Razor 2 项目中，与在 VS 2012 中创建新的 Razor 2 网站时默认提供的文件处于同一级别（_AppStart.cshtml、Default.cshtml等）

XML 文件似乎格式正确（此外，它在其他地方也成功使用过）：

<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<Platypi>
  <Platypus>
    <PlatypusNumber>1</PlatypusNumber>
    <LocationNumber>1</LocationNumber>
    <PlatypusName>CCR, Inc. Site 1 Q &amp; A</PlatypusName>
  </Platypus>
. . .
</Platypi>

我有这个 html 和 jQuery：

. . .
<ol class="round">
    <li class="one">
        <input type="submit" id="submit" value="Get Platypus.XML" />
        <div id="Platypus_Setup"></div>
    </li>

    <li class="two">
        <input type="submit" id="submit2" value="Get Platypus2.XML" />
        <div id="Platypus_Setup2"></div>
    </li>

    <li class="three">
        <input type="submit" id="submit3" value="Get Platypus3.XML"  />
        <div id="Platypus_Setup3"></div>
    </li>
</ol>

    <script>
        $(document).ready(function () {
            $('#submit').click(function () {
                $.ajax({
                    type: "GET",
                    url: "Platypus.XML",
                    dataType: "xml",
                    success: function (PlatypusRec) {
                        var platypusSetup = "<ul>";
                        $(PlatypusRec).find('Platypus').each(function () {
                            var platypusNum = $(this).find('PlatypusNumber').text()
                            platypusSetup += "<li>" + platypusNum + "</li>";
                        });
                        platypusSetup += "</ul>";
                        $('#Platypus_Setup').append(platypusSetup);
                    }
                });
                return false;
            });
        });
    </script>

（我改编自 aPress 书籍“jQuery 食谱”，食谱 8-8）

尽管如此，捣碎“获取 Platypus.XML”按钮不会将任何内容附加到 Platypus_Setup div 元素。它也不会抛出错误，它只是什么都不做（我可以看到）。

我在这里错过了什么？

更新

响应 LOUD 的“手动点击文件”的建议：

从以下位置更改 URL：

http://localhost:53321/XMLFileViewer/Default.cshtml

到：

http://localhost:53321/XMLFileViewer/PLATYPUS.XML

...显示 XML 文件，以及顶部的消息：

此 XML 文件似乎没有任何关联的样式信息。文档树如下所示。

另外，我在“return false;”上方添加了错误代码行：

error: function (xhr, status) {
    alert(xhr.status);
}
return false;

...但我不确定这是否是正确的位置，因为“状态”是灰色的；运行它并使用新的异常处理程序混合按钮并没有什么不同（我没有看到警报框）...

更新 2

移动上面的异常块：

error: function (xhr, status) {
                    alert(xhr.status);
                }
                });
                return false;

...在 VS2012 中加粗了“状态”，但在捣碎按钮时仍然没有错误消息。

Answer 1

至少，在下面的代码中将 $(Platypus) 更改为 $(PlatypusRec)：

success: function (PlatypusRec) {
    var platypusSetup = "<ul>";
    $(Platypus).find('Platypus')

另外，您在谈论哪些文件（视图/控制器/等）？根据您的路线，它可能无法接收。

我有一个名为 Platypus.XML 的 XML 文件，我已将它添加到我的 Razor 2 项目中，与创建新 Razor 2 网站时默认提供的文件处于同一级别

我会尝试从同一路径在浏览器中手动点击文件。我还会添加一个失败事件来尝试捕获服务器状态代码（404、500 等）

error: function(xhr, status) {
    alert(xhr.status); 
}

Answer 2

Resharper、jsFiddle 和Are these problems caught by jsFiddle causing the click event to malfunction? 帮助我清理了 jQuery；一旦我得到正确的语法，它就可以正常工作：

$(document).ready(function () {
        $('#submit').click(function () {
            $.ajax({
                type: "GET",
                url: "DuckbillSETUP.XML",
                dataType: "xml",
                success: function (platypusSetupRec) {
                    var platypussetup = "<ul>";
                    $(platypusSetupRec).find('platypus').each(function () {
                        var platypusNum = $(this).find('platypusNumber').text();
                        platypussetup += "<li>" + platypusNum + "</li>";
                    });
                    platypussetup += "</ul>";
                    $('#platypus_Setup').append(platypussetup);
                },
                error: function (xhr, status) {
                    alert(xhr.status);
                }
            });
            return false;
        });
    });