html - 更改下拉菜单的大小

Question

我创建了 2 个下拉列表，但我无法更改它们的大小。我想要屏幕宽度的下拉列表是我的代码

 <select id="repeatSelect" ng-model="selectedArea">
  <option ng-repeat="(key,prop) in result" value="{{key}}">{{key}}</option>
</select>
<select id="repeatSelect1" ng-model="selectedState">
  <option ng-repeat="state in result[selectedArea]" value="state">{{state}}</option>
</select>

http://plnkr.co/edit/nNsM4VMVeHXS2hDIsAAd?p=preview

谢谢

Answer 1

将样式 100% 添加到您的选择中

像这样

<select style="width:100%" id="repeatSelect" ng-model="selectedArea">

Answer 2

要更改下拉列表的大小，您可以在 js 中编写以下语句

jQuery('#repeatSelect').css('width','100%');

'#repeatSelect' - 这是下拉（选择）控件的 id。上面的语句应该存在于文档准备好。

Answer 3

将每个的宽度更改为 100%。使用下面的代码

 <select id="repeatSelect" ng-model="selectedArea" style="width:100%">
  <option ng-repeat="(key,prop) in result" value="{{key}}">{{key}}</option>
</select>
<select id="repeatSelect1" ng-model="selectedState" style="width:100%">
  <option ng-repeat="state in result[selectedArea]" value="state">{{state}}</option>
</select>