小编Ema*_*ott的帖子

我正在创建一个浏览大量图片的应用程序。此时，项目的那部分就完成了，它对正确的图片进行排序、过滤和加载，甚至将它们拆分为单独的页面以加快加载速度。

这很好用，但每页加载 25 张图片仍然需要 8 秒以上。我做了一些研究，并得出结论，使用异步 jQuery Ajax 请求最好尽可能快地同时加载它们。

到目前为止，这是我的代码：

var imageArray = <?php if (!empty($images)) {echo '["' . implode('", "', $images) . '"]';} else {echo "false";} ?>;
console.log(imageArray);
console.log(imageArray.length);
for (i = 0; i < imageArray.length; i++) {
    $.ajax({
        type: 'GET',
        url: imageArray[i],
        dataType: 'image/jpg',
        async: true,
        success: function (data) {
            $("#" + i).attr("src", data);
        }
    });
}

这段代码的问题在于它除了一个带灰色边框的空白色方块之外什么都不加载。当我修改代码并在 Chrome 的控制台中运行它时，data最终是一串混乱的字符，我认为这些字符是原始图像数据。

我已经搜索了几天，包括在 SO 上，但我还没有找到满足我需要的解决方案。相反，我找到了使用 jQuery 简单地将 url 放入图像源的解决方案，attr()这不是我需要的。

如果有人可以提供任何类型的解决方案来修复此代码，或者甚至是获取所有图像的不同且更有效的方法，我对任何事情都持开放态度。

图像阵列：http : //pastebin.com/03tvpNey

问候， …

我最近和最近的一些问题都没有收到,所以我想提一下你应该善待.其他一些人甚至没有明显的理由投票我的问题,没有任何评论表明他们的推理.我不喜欢这样,因为它让我有被阻止的风险.是的,我知道我的一些帖子并不是最经常考虑的,但是人们往往会对我一直在我面前的一个简单错误作出​​反应.现在,关于这个问题.

TL; DR:善待!

我有一个设置div:

<div id="settings">
    <p><a href="settings.php" class="settings">Search Settings</a></p>
    <p><a href="sync.php" class="settings">Sync Settings</a></p>
    <p><a href="anon.php" class="settings">Go Anonymous</a></p>
</div>

为了打开这个div,我有一个按钮:

<a onClick="openSettings()" href="#" class="footer" id="settings-button">Settings</a>

为了让按钮打开div,我有一些简单的JavaScript:

$("html").click(function(){
    $("#settings").slideUp()
});

$("#settings").click(function(e){
    e.stopPropagation();
});

function openSettings() {
    $("#settings").slideDown();
}

现在,出于任何原因,当我点击按钮时,它会打开div并再次关闭它.我发现这非常奇特.此时,我不知道该怎么做.我已经阅读了两个成功回答的Stack Overflow问题,我甚至尝试复制并粘贴确切的代码而没有结果.

这些文章在这里:

jQuery:如果在别处检测到点击,则隐藏弹出窗口

当我点击外面时如何让这个弹出框消失？

我在这一点上非常困惑,我不知道该怎么做.非常感谢任何帮助.

最诚挚的问候,伊曼纽尔

编辑:好的.似乎我忘了包含我的CSS样式,所以这里是:

div#settings {
display: none;
position: absolute;
right: 20px;
bottom: 50px;
background-color: #9E9E9E;
width: 200px;
box-shadow: 2px 2px 10px #000000;
border-style: solid;
border-color: #000000;
border-width: 1px;
color: #551A8B;
padding-left: 15px;
}