使用jQuery设置宽度后，select的宽度减少2px

Question

我已经浏览了几个页面来设置文本框的宽度并选择。我用jQuery 2.0来设置这个宽度。

我的项目中的

我的代码段：

＆＃13;

＆＃13;

$(document).ready(function(){
       
           $("#Text2").css('width','200px');       
$("#uxSeries").css('width','200px');
                  
});

＆＃13;

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input id="Text2" type="text" /> <br/>
       <select id="uxSeries" />

＆＃13;

＆＃13;

＆＃13;

这只是我项目的一小部分。请看下面的屏幕截图，对于文本框，它正确设置宽度（即200px）但是对于选择它显示198px。我不明白为什么宽度减少了2px。

我错过了什么吗？ 任何人都可以指导我吗？

Answer 1

是的，你犯了一个大错误。它是function而不是fuction：

$(document).ready(fuction(){
//------------------^

将其更改为：

$(document).ready(function () {

您还可以使用速记功能：

$(function () {

<强>段

这证明了这个问题。

$(document).ready(function () {
  $("#Text2").css('width','200px');       
  $("#uxSeries").css('width','200px');
});

* {box-sizing: border-box;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input id="Text2" type="text" />
<select id="uxSeries"></select>

Answer 2

提供的CSS适用于我

＆＃13;

＆＃13;

$(document).ready(function () {
  $("#Text2").css('width','200px');       
  $("#uxSeries").css('width','200px');
});

＆＃13;

* {box-sizing: border-box;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input id="Text2" type="text" />
<select id="uxSeries"></select>

＆＃13;

＆＃13;

＆＃13;