Question

我有以下代码：

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
    function loadPhotos(folderName){
            var folder = "assets/photos/"+folderName+"/";
            $.ajax({
                url : folder,
                success: function (data) {
                    $(data).find("a").attr("href", function (i, val) {
                        if( val.match(/\.(jpe?g|png|gif)$/) ) { 
                            $("body").append( "<img src='"+ folder + val +"'>" );
                        } 
                    });
                }
            });
          }
</script>
</head>

<html>
 <div onclick="loadPhotos('7thAnnual')">7th Annual</div>
</html>

由于某些奇怪的原因，当我点击div时，loadPhotos函数会在ajax调用中抛出404 not found错误....但是它所说的目录无法找到，确实存在。

对于记录，我在localhost（http://127.0.0.1:8020/）上运行它。

目录结构是Ljf / assets / photos / 7thAnnual ....

所以完整路径为http://127.0.0.1:8020/Ljf/assets/photos/7thAnnual

7thAnnual目录包含所有图像

有什么想法吗？

Answer 1

好的....所以我似乎必须完全限定网址中的名称：

var folder = "127.0.0.1:8020/Ljf/assets/photos/7thAnnual";

而不是仅使用：

var folder = "Ljf/assets/photos/7thAnnual"

这个答案带来了

＆＃34;仅支持协议方案的交叉原始请求：http，数据，chrome，chrome-extension，https，chrome-extension-resource。＆＃34;

这是与此帖不同的问题，但确实解决了

404未找到

所以我将其标记为答案

Answer 2

您必须创建目录assets / photos / 7thAnnual /。确保你做到了

Answer 3

如果你在chrome中运行它并打开漂亮的小检查员

（在某处右键单击背景，选择检查，然后转到检查窗口的网络选项卡）

然后单击应该触发ajax的div，它应该显示它尝试访问的路径。（在最底层的小网络面板上）

确保路径正确

查看响应以查看是否还有其他可能有用的信息

让我知道你发现了什么！

Jquery ajax给我一个404未找到的错误

3 个答案: