Javascript 更改HTML中项的宽度

我是HTML新手，我正在尝试使用phoneGap和jQuery插件构建一个移动应用程序。我目前正在使用eclipse进行编程，在我的应用程序中，我有一个drop dwon菜单选择，其中有几个项目。我正在尝试更改所选项目的宽度，但它不起作用。在这里你可以看到我做了什么来解决这个问题：

<label for="select-choice-1" class="select">Choose Expiry Date</label>
        <select id="date" name="select-choice-1" id="select-choice-1" style="width:150px">
        <option value="">1</option>
        <option value="">2</option>
        <option value="">3</option>
        <option value="">4</option>
</select>

来自jQuery移动文档：

刷新选定的

如果通过JavaScript操作select，则必须对其调用refresh方法来更新视觉样式。以下是一个例子：

var myselect = $("select#foo");
myselect[0].selectedIndex = 3;
myselect.selectmenu("refresh");

var myselect = $("select#foo");
myselect[0].selectedIndex = 3;
myselect.selectmenu("refresh");

---

嗯，您所做的是正确的，select元素的宽度由其内部选项的大小或CSS宽度控制

基于您的代码的示例：

---

以下是一个有效的示例：

从jqueryMobile文档中：

刷新选定的

如果通过JavaScript操作select，则必须对其调用refresh方法来更新视觉样式。以下是一个例子：

var myselect = $("select#foo");
myselect[0].selectedIndex = 3;
myselect.selectmenu("refresh");

var myselect = $("select#foo");
myselect[0].selectedIndex = 3;
myselect.selectmenu("refresh");

---

因此，如果您确实更改了宽度，您仍然需要刷新它

您所要做的就是包装您的选择菜单：

<div id="mySelect">
   <select id="cities">
    ...
   </select>
</div>

JAVASCRIPT:

$("#mySelect").css({"width":"150px"});

---

您希望它根据所选选项更改大小？您是如何将此函数添加到代码中的？你是怎么触发它的？我用你的代码是这样的：你的代码不起作用，因为你需要用函数{$'date'.css'width'，'new_Value'；}和b在加载正文时调用它，它只会被调用一次。Makram的例子实际上非常精确，完美地解释了你必须做的事情当你说foo时，它的意思是否与你预览答案中的日期相同？？在你的情况下，你会用$date或$selectdate替换$selectfoo，是的，这对我来说似乎真的很强大，我可以向你保证，在上面的例子中，选择框确实是250px。如果你的问题有点不同，请在顶部详细说明一下好吗？它不起作用，我使用的是jQuery移动框架，问题是我以前在文本字段上也有同样的问题，但后来我用width解决了这个问题，它也不起作用，你需要知道我使用的是jQuery移动框架！按照Semyazas的建议编写document.ready或function，并在其中包含js代码在最终明确使用jQuery Mobile后，问题就可以重现了

$("#mySelect").css({"width":"150px"});