在函数中使用“动态变量”

我不确定如何在JavaScript中解决这个问题，所以我讨论了“动态变量”。如果还有更好的办法，请告诉我！在函数中使用“动态变量”

由于是一个参数（左或右）的函数：

var footerMenuLeftOpen = true; 
 
var footerMenuRightOpen = true; 
 

 
function footerMenu(menuName, className) { 
 

 
    if (menuName) { 
 
    $('.content-' + className).animate({ 
 
     height: "+=28px", 
 
    }, { 
 
     duration: 100 
 
    }); 
 
    return false; 
 
    } else { 
 
    $('.content-' + className).animate({ 
 
     height: "-=28px", 
 
    }, { 
 
     duration: 100 
 
    }); 
 
    return true; 
 
    } 
 
} 
 

 

 
$(".content-left").click(function() { 
 
    footerMenuLeftOpen = footerMenu(footerMenuLeftOpen, 'left'); 
 
}); 
 
$(".content-right").click(function() { 
 
    footerMenuRightOpen = footerMenu(footerMenuRightOpen, 'right'); 
 
});

.content-left { 
 
    width: 200px; 
 
    height: 100px; 
 
    background-color: red; 
 
    display: inline-block; 
 
} 
 

 
.content-right { 
 
    width: 200px; 
 
    height: 100px; 
 
    background-color: blue; 
 
    display: inline-block; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="content-left"> 
 

 
</div> 
 

 
<div class="content-right"> 
 

 
</div>

现在我想添加代码，在高度的变化（+/- 28px）取决于在红色或蓝色框的高度。因此，我想在盒子显示后尽快检查盒子的起始高度。

例如：

if ($('.content-left').height() > 42) { 
    LeftHeight: "+=28px", 
} else if ($('.footer-button-box.left').height() > 28) { 
    LeftHeight: "+=14px", 
} else { 
    LeftHeight: "+=5px", 
}

但我怎么现在改功能“footerMenu”的高度值，以便从IF函数关于所确定的值，高度的变化？

我因子评分关于类似

$('.content-' + className).animate({ 
     height: className+Height, 
    }, { 
     duration: 100 
    });

...其中，类名是“左”加术语“高度”;所以离开了高度。

我想有一种更好的解决方案，使其工作只有一个优雅的功能？

在此先感谢！

编辑：由于我的问题是很难理解，在简单的话：

我有变量“leftHeight”和“rightHeight”。现在：我如何从一个函数中访问这些变量，其中left/right是参数的值？

目标：高度：leftHeight

理念：高度：类名+“高度”

...所以如何使用功能变量名称的一部分的参数的值？

来源

2017-05-30 user1658080

'if'不是一个函数，不返回任何东西。使用三元运算符，并将它们放置在属性值的位置。 – Bergi

不知道你想在这里做什么，但如果你想，你可以看看flexbox，我认为它可以满足你的要求..没有jS –

我自己找到了解决方案：我不得不使用对象。

var footerMenuHeight = new Object(); 

if ($(".content-left").height() > 40) { 
    footerMenuHeight.left = 200; 
} else if ($(".content-left").height() > 30) { 
    footerMenuHeight.left = 18; 
} else { 
    footerMenuHeight.left = 8; 
}

所以我能够使用该参数来访问这个对象的值：

footerMenuHeight[className]

来源

2017-05-30 15:07:02 user1658080

在JavaScript中使用'{}'而不是'new对象（）'。 –

在函数中使用“动态变量”

回答

相关问题