javascript - 从e文件夹加载图像并以html显示它们

标签 javascript ajax

大家好,通过使用以下代码,我尝试从文件夹中读取所有图像,然后将它们显示在我的 html 文件中。问题是你如何看到/images/文件夹位于/fetch/文件夹中。当显示图像时,像/fetch/frame_1.jpg 而不是/fetch/images/frame_1.jpg 一样加载,因此在这种情况下要显示它们,我必须使用两倍的图像集。一份在图像文件夹中,一份在提取文件夹中。谁能给我解释一下这是为什么吗?

<body>
        <script type="text/javascript">
            var dir = "/fetch/images/";
            var fileExtension = ".jpg";
            $.ajax({
                url: dir,
                success: function (data) {
                    $(data).find("a:contains(" + fileExtension + ")").each(function () {
                        var fileName = this.href.replace(window.location.host, "").replace("http://", "");
                        $("body").append("<img src='"+ fileName + "'>");
                        console.log(fileName);
                    });
                }
            });
        </script>
    </body>

最佳答案

两个改变让我得到了图像。 1) 从 var 目录中删除正斜杠/反斜杠。 2)组合目录和文件名。

下面是对我有用的代码:

<body>
    <script type="text/javascript">
        var dir = "fetch/images/";
        var fileExtension = ".jpg";
        $.ajax({
            url: dir,
            success: function (data) {
                $(data).find("a:contains(" + fileExtension + ")").each(function () {
                    var fn = this.href.replace(/^.*[\\\/]/, '');
                    var fileName = dir + fn;
                    $("body").append("<img src='"+ fileName + "'>");
                    console.log(fileName);
                });
            }
        });
    </script>
</body>

关于javascript - 从e文件夹加载图像并以html显示它们,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34658400/

相关文章:

javascript - fancybox 难以打开 html 页面

javascript - 如何将属性应用于存在但不立即可见的钛元素?

ajax - `success: function(msg)` 在我的 jQuery Ajax 调用中意味着什么?

javascript - Flask AJAX 请求返回空 ImmutableMultiDict,相同的 AJAX 适用于 http.server

ajax - ListView ('refresh' )不工作

php - Jquery $.post 返回错误的数据

javascript - Google Charts - 尝试在弹出窗口中添加链接或任何形式的自定义 html

javascript - 在 react 导航 5.x 上动态更改标题标题

javascript - 提供下载 pdf 或在浏览器中打开的选项

php - 带有动态表删除记录按钮的 jQuery 对话框不起作用