jquery外掛select2事件不起作用（select2-3.5.4）
jquery外掛select2事件不起作用
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
蕃薯耀 2015年10月8日 09:01:53 星期四
一、官網的說明：https://select2.github.io/examples.html（Version 4.0.0）
change is fired whenever an option is selected or removed.
select2:open is fired whenever the dropdown is opened. select2:opening is
fired before this and can be prevented.
select2:close is fired whenever the dropdown is closed. select2:closing is
fired before this and can be prevented.
select2:select is fired whenever a result is selected. select2:selecting
select2:unselect is fired whenever a result is unselected. select2:unselecting is
fired before this and can be prevented.
二、官網的使用例子：
倫理片http://www.dotdy.com/
- var $eventLog= $(".js-event-log");
- var $eventSelect= $(".js-example-events");
-
$eventSelect.on("select2:open",function(e){ log("select2:open", e);});
- $eventSelect.on("select2:close",function(e){ log("select2:close", e);});
- $eventSelect.on("select2:select",function(e){ log("select2:select", e);});
- $eventSelect.on("select2:unselect",function(e){ log("select2:unselect", e);});
- $eventSelect.on("change",function(e){ log("change");});
但是在實際應用中select2:close不起作用。
三、解決方法：
這個原因找了很久都沒有找到，昨天終於發現原因了：
Js程式碼
- $("#xxx").on("select2-close", function (e) {
- });
原來是select2-close，中間的不是冒號，而是 - （橫槓），修改後就能使用了
jquery.validate.js外掛也能完善校驗。
Js程式碼
- $("#genders").on("select2-close", function (e) {
- $(this).valid();
- });
最終原因是select2的版本問題
在3.5.4版本中的事件為：
Events
change
Fired when selection is changed.
The event object contains the following custom properties:
valThe current selection (taking into account the result of the change) - id or array of ids.addedThe added element, if any - the full element object, not just the id.removedThe removed element, if any - the full element object, not just the id.select2-opening
Fired before the dropdown is shown.
The event listener can prevent the opening by calling preventDefault() on
the supplied event object.
select2-open
Fired after the dropdown is shown.
select2-close
Fired after the dropdown is closed.
select2-highlight
Fired when a choice is highlighted in the dropdown.
The event object contains the following custom properties:
valThe id of the highlighted choice object.choiceThe highlighted choice object.select2-selecting
Fired when a choice is being selected in the dropdown, but before any modification has been made to the selection. This event is used to allow the user to reject selection by calling event.preventDefault()
The event object contains the following custom properties:
valThe id of the highlighted choice object.choiceThe choice object about to be selected.select2-clearing
Fired when a choice is being cleared in the dropdown, but before any modification has been made to the selection. This event is used to allow the user to reject the clear by calling event.preventDefault()
For the clear button to be visible the allowClear option
needs to be true.
select2-removing
Fired when a choice is about to be removed in the dropdown/input, but before any removal of the choice has been made. This event is used to allow the user to reject removal by calling event.preventDefault()
The event object contains the following custom properties:
valThe id of the removing choice object.choiceThe choice object about to be removed.select2-removed
Fired when a choice is removed or cleared.
The event object contains the following custom properties:
valThe id of the highlighted choice object.choiceThe highlighted choice object.select2-loaded
Fired when query function is done loading the data and the results list has been updated
The event object contains the following custom properties:
itemsdata that was used to populate the results.select2-focus
Fired when the control is focussed.
select2-blur
Fired when the control is blurred.
影音先鋒電影http://www.iskdy.com/
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>