javascript - 使用 jQuery 将 x% 宽度添加到 div

Question

我有一种初始宽度为 0% 的“加载条”。

<div id="loading_bar"></div>

现在我也有一个表格......它有不同类型的字段......

例如，我有 5 个选择框...现在如果我从选择框 nr1 中选择某些内容...必须从 0% 更改为 20%...现在如果我从选择框 nr2 中选择某些内容，则将另外 20% 添加到该 div 宽度... 等等...

我写了这段代码，但它给了我像素而不是百分比......

$("#loading_bar").css("width", "+=20");

我怎么写才能让它增加 20% 而不是 20px ..？有人可以帮忙...谢谢

编辑/更新

我有5个选择框...

对于每个选择框，我都有一个 IF ELSE 语句..

例如：如果选择了 selectboxnr1 将 20% 添加到 div...如果它被取消选择（未选择）... 减去 20%

等等每5个选择框..

PS我为每个选择框手动写了％......所以例如我写

$("#loading_bar").css("width", 20+"%")

score 1 · Accepted Answer

你需要两个步骤：

var new_width = $("#loading_bar").css("width") * 1,2
$("#loading_bar").css("width",new_width+"px")

如果您在 css 中使用它，请替换px为。%

score 0 · Accepted Answer

当我假设你在某处有实际正确的百分比时，你为什么要这样做？

$("#loading_bar").css("width", percentage+"%")

score -1 · Accepted Answer

你可以更干净，并为它写一个 CSS 语句

.width-20percent {
    width: 20%;
}

然后添加类：

$("#loading_bar").addClass('width-20percent ');

这也将允许您轻松地在其他元素上重复使用它，并使其在您改变主意时只需要编辑一次。.

希望这可以帮助：）

score -1 · Accepted Answer

试试这个

更新，您可以使变量递增并执行此操作

    $("#loading_bar").css({width, With+"%"})

或者

    $("#loading_bar").css("width",With+"%")

4 回答 4