我一直在为我的webapp http://jamielottering.github.com/DropKick/使用一个名为DropKick的漂亮，优雅的插件，但似乎有一点点问题，不确定如何解决它。我正在尝试以编程方式更改选择下拉菜单的值。以下是对我的问题的描述，以及指向JSFiddle的链接。
HTML:
<select id="start" class="timePreference">
<option value="Choose">Choose</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
jQuery:
$('.timePreference').dropkick();
$('#someDiv').click(function() {
$('#start').val("1");
alert($('#start').val());
);
当我在alert中显示值时，它显示为1，但是当我查看选项上的标签时，它保持默认值或更改之前的值。
例如，如果我的默认值是“Choose”，然后单击someDiv，则alert将显示为“1”，因此它会发生变化，但是select下拉列表仍将显示“Choose”。有什么建议么。我可能只是想念一些小东西，不确定。
FSFiddle:http://jsfiddle.net/kdp8791/aNS9R/61/
最佳答案
工作演示:带有Commnet的 http://jsfiddle.net/aNS9R/218/ && ，不带注释仅需要7行:http://jsfiddle.net/aNS9R/220/
-phe-
因此，首先，我尝试了在drop kick中使用[dropkick]的Change事件，但它仅用于select和中的change事件，而不是来自外部元素绑定(bind)。 ，即您的情况更改按钮。
所以;这是我所做的:
说明(如果您有兴趣)
我使用firebug来检查变量，发现当您使用dropkick创建的$('#timePreference option:selected').val("1"); dropkick actually did changed the selected value with in your element with id=timePreference but the div and ul and li styling时，dropkick现在可以以良好的样式将现有选择编码。
对于所选跨度，它具有.dk_label类，对于当前(绿色)，由.dk_option_current类给出。
请注意我已经读了很多插件，并从这里弄清楚发生了什么:https://github.com/JamieLottering/DropKick/blob/master/jquery.dropkick-1.0.0.js
如果您想使用Firebug并查看元素的本身，请使用此链接:http://jsfiddle.net/aNS9R/218/show/并使用您的检查模式，您将看到dropkick样式及其工作方式。
jQuery代码
$(document).ready(function() {
$('#timePreference').dropkick();
$('#go').click(function(){
// Assign slected option value to your select here -
// you can also make it something like this but your existing cdoe works anyways $("select_id option[value='3']").attr('selected','selected');
$('#timePreference').val("1");
//Now assign the select text value to the dropkick added element.
//If you will use firebug you can see the nice <div>, <ul> & <li> structure which morph your dropdown.
$('.dk_label').text(1);
// further if you want green color to be selected. class=dk_option_current does that
// You need to loop through the dropkick hierachy
$(".dk_options_inner li").each(function(){
$(this).removeAttr('class');
if ($(this).text() == "1"){
$(this).attr('class', 'dk_option_current');
}
});
});
});
希望这可以帮助您交配，加油!
HTML
<select id="timePreference">
<option value="Choose" selected="selected">Choose</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<input name="go" id="go" type="button" value="change" />