Событие JQuery, которое вызывается при выборе раскрывающегося списка, но значение не изменяется

Question

У меня есть выпадающее меню, к которому я хочу подключить событие JQuery, которое срабатывает, если кто-то нажимает на него, но затем выбирает ту же опцию, которая уже выбрана.

У меня все работает, используя событие 'change ', но бывают случаи, когда пользователь может щелкнуть раскрывающийся список и повторно выбрать ту же опцию. Если это произойдет, мне нужен мой обработчик событий для запуска.

Как я могу это сделать?

Answer 1

Попробуйте что-то вроде ниже,

С помощью .click

$(function () {
    var cc = 0;
    $('select').click(function () {        
        cc++;
        if (cc == 2) {
            $(this).change();
            cc = 0;
        }         
    }).change (function () {
        $('#result').append('Changed triggered ');
        cc = -1;
    });     
});

ДЕМО: http://jsfiddle.net/skram/NAHXP/2/

Или используя .focus а также .blur

$(function () {
    var ddVal = '';
    $('select').focus(function () {
        ddVal = $(this).val();
    }).blur(function () {
        if (ddVal == $(this).val()) {
            $(this).change();
        }
    }).change (function () {
        $('#result').append('Changed triggered ');
    });       
});

ДЕМО: http://jsfiddle.net/skram/NAHXP/

Answer 2

Используйте фокус и размытие событий...

var selectValue;
$('select').focus(function(){
   selectValue = $(this).val();
}).blur(function(){
  if (selectValue == $(this).val()) {
     //nothing change event
  }
})

Answer 3

Вот решение щелчка

var oldValue = null;
$('select').click(function(){
  s = $(this);
  val = s.val();
  if (oldValue == null) {
      oldValue = val;
  } else {
      oldValue == s.val() ? alert('nothing changed') : alert('new value');
      $(document).unbind('click.valueCheck');
      oldValue = null;      
  }
})

DEMO

Вот более продвинутое решение с расширенным щелчком документа

demo2

Answer 4

Другие ответы, по-видимому, не обеспечивают решение, которое одновременно обрабатывает все крайние случаи (например, щелкает вне выпадающего списка и затем щелкает по нему снова) и / или избегает двойных событий.

Первый трюк заключается в сохранении значения с момента фокусировки раскрывающегося списка. Событие по умолчанию change() используется для запуска метода changewithRepeats когда значение выпадающего меню изменилось, как обычно.

В противном случае, второй щелчок по сфокусированному элементу вызовет blur(), вызывая расфокусировку и запуск changewithRepeats тогда и только тогда, когда значение выпадающего меню остается таким же, как и в начале.

Открыть выпадающий список и отменить его невозможно, это сделано намеренно. Любая расфокусировка вызовет метод. Все взаимодействия с клавиатурой также работают (но вызов blur () при выборе одного и того же значения будет немного раздражать для пользователей с программами чтения с экрана).

Состояние фокуса ниже: 0 = не сфокусировано, 1 = при получении фокуса, 2 = имеет фокус.

$(function () {
  var lastFocusValue = '';
  var focusState = 0;

  var changeWithRepeats = function (newestValue) {
    // Your change action here
  };

  $('select').click (function () {
    if (focusState == 1) { focusState = 2; return; }
    else if (focusState == 2) $(this).blur();
  }).focus(function (e) {
    focusState = 1;
    lastFocusValue = $(this).val();
  }).blur(function () {
    focusState = 0;
    if ($(this).val() == lastFocusValue) {
      // Same value kept in dropdown
      changeWithRepeats($(this).val());
    }
  }).change (function () {
    changeWithRepeats($(this).val());
  });
});

У Fiddle есть еще несколько результатов отладки: https://jsfiddle.net/dsschneidermann/tb5csdhp/15/

Answer 5

Используйте add class для решения этой проблемы

 $("#test").change(function(event){
 if($(this).find('option:selected').hasClass('actived'))
   alert('already selected');//write you code here
 else
   $(this).find('option:selected').addClass('actived');

});

и перейдите по этой ссылке http://jsfiddle.net/muthukumar0705/nARVu/1/