[英]jQuery Chosen: change event doesn't fire from AJAX call
I'm using jQuery Chosen on my page and I want to run a function every time a new option is selected. 我在页面上使用的是jQuery Chosen ,并且每次选择一个新选项时都想运行一个函数。 The function hides all of the child
div
s in a parent div
, then shows just the one that corresponds to the option that was selected. 该函数将所有子
div
都隐藏在父div
,然后仅显示与所选选项相对应的子div
。
HTML: HTML:
<select id="settings-select" data-placeholder="Choose…" class="chzn-select">
<option value="setting1">Option 1</option>
<option value="setting2">Option 2</option>
<option value="setting3">Option 3</option>
<option value="setting4">Option 4</option>
<option value="setting5">Option 5</option>
<option value="setting6">Option 6</option>
</select>
<div id="settings-tabs">
<div id="setting1" class="tab">...</div>
<div id="setting2" class="tab">...</div>
<div id="setting3" class="tab">...</div>
<div id="setting4" class="tab">...</div>
<div id="setting5" class="tab">...</div>
<div id="setting6" class="tab">...</div>
</div>
JS: JS:
var settingsShow = function(){
var showPanel = $("#settings-select").find('option:selected').val();
$("#settings-tabs .tab").hide();
$("#" + showPanel).fadeIn("fast");
alert(showPanel);
}
$(document).ready(function(){
$("#settings-tabs .tab").hide();
$("#settings-select").chosen().change(settingsShow);
});
All of this works fine so far – when the selected item is changed, settingsShow
is called (and an alert displays just to confirm this). 到目前为止,所有这些方法都可以正常工作–更改所选项目时,将调用
settingsShow
(并且会显示警报来确认这一点)。
Now, I also have an AJAX call that changes the selected option when it completes: 现在,我还有一个AJAX调用,它会在完成时更改选定的选项:
$("#settings-select").val("setting1").trigger("liszt:updated");
settingsShow();
Here's the problem: once the selected option is changed by the completed AJAX call, selecting the previously-selected option no longer fires the change event. 问题是:完成的AJAX调用更改了所选选项后,选择先前选择的选项将不再触发更改事件。 For example:
例如:
I know it's an issue with Chosen specifically because it works fine if I use a normal select
instead (at step 3 above, I'll get an alert that says "option2", like I should). 我知道这是Chosen的一个问题,特别是因为如果我改用普通的
select
它会很好地工作(在上面的第3步中,我会收到警告说“ option2”,就像我应该的那样)。 But as you can see, I'm using .trigger("liszt:updated")
to update the select
when the AJAX call changes the selected option, so I don't see why this doesn't work. 但是正如您所看到的,当AJAX调用更改了选定的选项时,我正在使用
.trigger("liszt:updated")
更新select
,所以我不明白为什么这不起作用。
It turns out this is a legitimate bug in Chosen 0.9.8 (the current release version). 事实证明,这是选择的0.9.8(当前发行版)中的合法错误。 I updated to the cutting-edge version (not officially released) and the problem corrected itself with no other changes.
我更新到了最新版本 (未正式发布),并且此问题得以纠正,没有进行其他更改。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.