以下是代码段。我试图根据窗口和位置的大小影响类属性 margin-bottom 。我已经在高度,宽度等所有实例中都能使用它...但由于某些原因,使用 margin-bottom ,所有类都占用了我最后一个javascript函数的大小。我不确定这是否有意义?代码如下:
//Javascript
var thisMB = null;
$("#Full").find(".t16").each(function () {
thisMB = '1.25em';
});
$("#Full").find(".t8").each(function () {
thisMB = '4.4175em';
});
$(this).css("margin-bottom", thisMB);
<!--html-->
<div>
<ul class="tlist">
<li class="theTeams t16">1 1upLeft upLeft upLeft </li>
<li class="theTeams t16">1 1upLeft upLeft upLeft </li>
<li class="theTeams t16">3 1 upLeft upLeft upLeft </li>
<li class="theTeams t16">4 1 upLeft upLeft upLeft </li>
<li class="theTeams t16">5 1 upLeft upLeft upLeft </li>
<li class="theTeams t16">6 1 upLeft upLeft upLeft </li>
</ul>
</div>
<div>
<ul class="tlist">
<li class="theTeams t8">1 upLeft upLeft upLeft </li>
<li class="theTeams t8">3 upLeft upLeft upLeft </li>
<li class="theTeams t8">5 upLeft upLeft upLeft </li>
</ul>
</div>
基本上,我的LI将采用后一种javascript函数,而不是它们所找到的特定类实例。所以.t16应该有一个底边(比方说)14,而.t8应该是42 ......他们都是42.如果我移动订单他们都是14。
想法?
答案 0 :(得分:2)
var thisMB = null;
$("#Full").find(".t16").each(function () {
thisMB = '1.25em'; <--- this assigns the same variable over and over again
});
$("#Full").find(".t8").each(function () {
thisMB = '4.4175em'; <--- so does this
});
$(this).css("margin-bottom", thisMB); <--- this sets the element to thisMB = the final value.
您反复分配变量,但将其分配给循环外的“this”。如果要设置所选元素(this
)的值,则需要将each().
循环置于其中
答案 1 :(得分:0)
您要设置两次变量,每次都使用不同的值。基本上你是这样做的:
var thisMB = null;
thisMB = '1.25em';
thisMB = '4.4175em';
如果你然后检查thisMB的值,你会得到最后一个值:'4.4175em'。
我认为这就是你想要的:
$("#Full .t16").each(function () {
$(this).css('margin-bottom', '1.25em');
});
$("#Full .t8").each(function () {
$(this).css('margin-bottom', '4.4175em');
});
<强>更新强>
稍短一些:
$("#Full .t16").css('margin-bottom', '1.25em');
$("#Full .t8").css('margin-bottom', '4.4175em');