html 菜单右侧宽度,HTML下拉菜单自动调整宽度

出于某种原因，虽然调整大小发生，但它总是调整太大或太小。这里的的jsfiddle：https://jsfiddle.net/yadhwb97/3/

这是HTML：

Options

Something super long in here

Short

这是jQuery的：

$(document).ready(function() {

$('.dropdown').change(function(){

$("#width_tmp_option").html($('.dropdown option:selected').text());

$(this).width($("#width_tmp_select").width()+30);

});

});

当您选择下拉选项，你会看到它如何调整其大小要么太太多或太少。我如何正确地调整大小？

+0

您可以随时增加'宽度value'即取代'+ 30'使用别的东西。但是，获得准确的解决方案可能有点棘手。您必须将每个选项的初始宽度存储在具有'name'和'width'的对象中，然后在更改时根据选择拉取值并设置宽度。现在，当选择长选项时，您可以将宽度设置为280，但您需要考虑稍后将添加的将来/其他选项。 –