https://www.texilajournal.com/v2/commonfiles/js/site/jquery.jelect.js

1;(function ( $, window, document, undefined ) {
2	'use strict';
3
4	var Jelect,
5		pluginName = 'jelect',
6		dataPlugin = 'plugin_' + pluginName,
7		defaults = {
8			wrapper: '.jelect',
9			input: '.jelect-input',
10			current: '.jelect-current',
11			optionsWrapper: '.jelect-options',
12			option: '.jelect-option',
13			activeClass: 'jelect_state_active',
14			optionsWrapperActiveClass: 'jelect-options_state_active',
15			optionActiveClass: 'jelect-option_state_active'
16		};
17
18	Jelect = function ( element, options ) {
19		this.element = element;
20		this.$element = $( element );
21		this.options = $.extend( defaults, options );
22		this._defaults = defaults;
23
24		this.init();
25	};
26
27	Jelect.prototype = {
28
29		init: function ( options ) {
30
31			var that = this,
32				opts = $.extend( that.options, options ),
33				$select = that.$element,
34				$selectOptions = $( opts.optionsWrapper );
35
36			$select
37				// Open a dropdown
38				.children( opts.current )
39				.on( 'click.jelectCurrentClick', function () {
40					var $this = $( this ),
41						$thisSelect = $this.closest( opts.wrapper ),
42						$thisSelectOptions = $this.siblings( opts.optionsWrapper );
43
44					$thisSelectOptions.toggleClass( opts.optionsWrapperActiveClass );
45					$selectOptions.filter( ':visible' ).not( $thisSelectOptions ).removeClass( opts.optionsWrapperActiveClass );
46
47					$thisSelect.toggleClass( opts.activeClass );
48					$select.not( $thisSelect ).removeClass( opts.activeClass );
49				})
50
51				// Select an option
52				.siblings( opts.optionsWrapper )
53				.on( 'click.jelectOptionClick', opts.option, function () {
54					var $this = $( this ),
55						currentVal = $this.data('val'),
56						currentText = $this.text();
57
58					$this
59						// Activate a selected option
60						.addClass( opts.optionActiveClass )
61						.siblings()
62						.removeClass( opts.optionActiveClass )
63
64						// Hide a dropdown
65						.closest( opts.optionsWrapper )
66						.removeClass( opts.optionsWrapperActiveClass )
67
68						// Deactivate a Jelect wrapper
69						.closest( opts.wrapper )
70						.removeClass( opts.activeClass )
71
72						// Set a current text
73						.children( opts.current )
74						.text( currentText )
75
76						// Change the value of input and fire trigger `change`
77						.siblings( opts.input )
78						.val( currentVal )
79						.attr( 'data-text', currentText )
80						.trigger( 'change' );
81				});
82
83			// Hide dropdowns when click outside
84			$( document ).on( 'click.jelectOutsideClick', function ( e ) {
85				var $target = $( e.target );
86
87				if (
88					!$target.is( opts.wrapper ) &&
89					!$target.closest( opts.wrapper ).length &&
90					$selectOptions.filter( ':visible' ).length
91				) {
92					$selectOptions
93						.removeClass( opts.optionsWrapperActiveClass )
94						.closest( opts.wrapper )
95						.removeClass( opts.activeClass );
96				}
97			});
98
99		},
100
101		destroy: function () {
102			this.$element.data( dataPlugin, null );
103		}
104	};
105
106	$.fn[ pluginName ] = function ( options ) {
107		return this.each(function () {
108			if ( !$( this ).data( dataPlugin ) ) {
109				$( this ).data( dataPlugin, new Jelect( this, options ) );
110			}
111		});
112	};
113
114})( jQuery, window, document );