根据内容高度附加内容答案

【问题标题】：Appending content depending on content height根据内容高度附加内容
【发布时间】：2013-03-12 18:22:09
【问题描述】：

所以我知道我这样做是错误的，但我被困住了，所以我想你们可以帮助我。所以我的想法是我有两个容器。一种仅用于小于某个高度的内容，一种用于大于某个高度的内容。所以这里是一个代码的基本草图，它不能给你一个基本的想法：

$('#content').each(function(){
if($(this).height()>120){
    $('#container2').append('the content');
};
else{
    $('#container').append('the content');
};
});

这是一个 jsfiddle，它显示了结果应该是什么样的：http://jsfiddle.net/3TxR9/1/

编辑 1：id 内容包含了大量不同的内容，这就是为什么我想要不同高度的不同容器。因此，“内容”将是 id 内容中的特定内容，这样每条内容都会被评估，因此它会进入正确的容器。而且我链接的 jsfiddle 不是正确的编码，它只是为了显示应用正确的 jquery 时会发生什么

【问题讨论】：

$('#content').each(function(){ 没有意义，除非您有多个 id 为 content 的元素，这是严格禁止的。
为什么用分号分隔 if / else 语句？那会破坏任何东西。一看你的 jsFiddle 就可以看到 id="content" 的多个实例......你想要 class="content"，因为 id 是一个独特的属性
应该为每个元素添加的 the content #content ？
哦，我用分号打字是个意外，但就#content问题而言...我的内容包含在 id 内容中，js fiddle 只是为了显示一个例子。无论如何，我对每个事件都不太确定......那么你会建议什么？
每个都是正确的，您重复使用 ID 的事实是问题所在。 ID 应该是唯一的非重复元素，类用于重复并共享相同样式的元素。您所做的应该可以正常工作，只需将宽度（如果重要的是高度，您为什么要查看宽度）交换高度并去掉分号。然后将整个部分包装在一个 document.ready 函数中，这样它就可以在页面加载时完成。

标签： javascript jquery if-statement append each

【解决方案1】：

我认为你只是让自己变得比你需要的更难，因为.height() in jQuery 会给你任何你想要的元素的计算高度。

然后，当您处理您的项目时，您可以在要排序的元素上使用 .height()，如果大于某个高度，则将其附加到一个框，否则将其附加到另一个框。

【讨论】：

我输入了宽度，但我的意思是输入高度。那么，如果这是唯一需要更改的东西，因为它只是一个错字，那么如果我通常具有上述内容，那为什么它对我不起作用呢？
好吧，从一件事开始尝试它 - 杀死 each() 函数，然后在一个盒子上运行 if。此外，尝试打印/记录 height() 函数的结果，就好像有问题的项目没有加载或不可见一样，它可能不会报告您认为应该的高度。如果它报告 0 高度并且您认为它不应该，如果没有加载它会这样做，解决方案在这里：stackoverflow.com/questions/3761061/…
嘿，所以一切正常，但是你说可能发生的问题出现了，提供的解决方案最终没有工作
也许可以尝试 window.load() 方法以确保在检查之前加载所有图像：stackoverflow.com/questions/4857896/… 如果这不起作用，您可能需要更新您的问题，最好有一个额外的jsfiddle 出错的代码。
Window.load 也不起作用...如果它有助于我使用砖石插件

【解决方案2】：

$(document).ready(function(){
    $(".content").each(function(){
        if($(this).height() > 100)
        {
            $(this).appendTo("#container");
            $(this).show();
        } else {
            $(this).appendTo("#container2");
            $(this).show();
        }
    });
});

演示：http://jsfiddle.net/calder12/3TxR9/4/

【讨论】：