Показать сообщение отдельно
  #1 (permalink)  
Старый 14.10.2022, 15:06
Новичок на форуме
Отправить личное сообщение для wainzor Посмотреть профиль Найти все сообщения от wainzor
 
Регистрация: 01.06.2022
Сообщений: 6

Сброс кастомного селекта
Всем привет! Есть обычный селект
<select class="select" name="referrer">
                    <option value="">Значение1</option>
                    <option value="1">Значение2</option>
                    <option value="2">Значение3</option>
                  </select>


Который для кастомизации с помощью js преобразован в список
$('.select').each(function(){
  // Variables
  var $this = $(this),
    selectOption = $this.find('option'),
    selectOptionLength = selectOption.length,
    selectedOption = selectOption.filter(':selected'),
    dur = 500;

  $this.hide();
  // Wrap all in select box
  $this.wrap('<div class="select"></div>');
  // Style box
  $('<div>',{
    class: 'select__gap',
    text: 'Значение По Умолчанию'
  }).insertAfter($this);
  
  var selectGap = $this.next('.select__gap'),
    caret = selectGap.find('.caret');
  // Add ul list
  $('<ul>',{
    class: 'select__list'
  }).insertAfter(selectGap);		

  var selectList = selectGap.next('.select__list');
  // Add li - option items
  for(var i = 0; i < selectOptionLength; i++){
    $('<li>',{
      class: 'select__item',
      html: $('<span>',{
        text: selectOption.eq(i).text()
      })				
    })
    .attr('data-value', selectOption.eq(i).val())
    .appendTo(selectList);
  }
  // Find all items
  var selectItem = selectList.find('li');

  selectList.slideUp(0);
  selectGap.on('click', function(){
    if(!$(this).hasClass('on')){
      $(this).addClass('on');
      selectList.slideDown(dur);

      selectItem.on('click', function(){
        var chooseItem = $(this).data('value');

        $('select').val(chooseItem).attr('selected', 'selected');
        selectGap.text($(this).find('span').text());

        selectList.slideUp(dur);
        selectGap.removeClass('on');
      });
      
    } else {
      $(this).removeClass('on');
      selectList.slideUp(dur);
    }
  });		

});


Вопрос, как сделать кнопку reset при нажатии на которую будет происходить сброс выбранных значений до значения по умолчанию. Спасибо
Ответить с цитированием