从e文件夹加载图像并以html格式显示

时间:2016-01-07 15:01:59

标签: javascript ajax

大家好,通过使用以下代码,我试图从文件夹中读取所有图像,然后在我的html文件中显示它们。问题是如何在/ fetch /文件夹中看到/ images /文件夹。显示图像时会加载/fetch/frame_1.jpg而不是/fetch/images/frame_1.jpg,所以在这种情况下显示它们我必须使用两次图像集。一个在图像文件夹中,一个在fetch文件夹中。任何人都可以向我解释为什么会这样?

<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 个答案:

答案 0 :(得分:1)

两次改变让我得到了图片。 1)从var dir中删除前进/后退斜杠。 2)结合dir和文件名。

以下代码对我有用:

<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>