Подтвердить что ты не робот

JQuery change() в <select> и firefox

У меня есть раскрывающийся список, который вызывает аякс-вызов при его изменении:

$('.travel-to').change(function(){  
    $.ajax({
        type: "GET",
        url: "/inc/rates/rates-viewer.php",
        data: "shtech=y&c_name="+escape($(this).val()),
        success: function(html){
            $(".rates-viewer").html(html);
            $(".rates-viewer tr.numbers td").css({ opacity: 0 }).fadeTo("slow",1);
        }
    });
});

Моя проблема заключается в том, что в Firefox, используя клавиши курсора вверх/вниз для циклического перехода по раскрывающимся спискам, не запускается событие js onChange(). Это нормально в IE.

Как я могу заставить Firefox видеть курсоры вверх/вниз как onChange? Могу ли я сделать либо/или на событии, чтобы сделать либо onChange, либо нажатие клавиши одним и тем же?

Спасибо.

4b9b3361

ОТВЕТЫ

Ответ 1

Вы действительно используете ошибку в IE. Firefox поддерживает onChange правильно, так как он не должен срабатывать, пока браузер не потеряет фокус поля выбора. (I ответил на вопрос вчера об этой самой проблеме. Фактически, это действительно опасно использовать onChange с выбором, тем более, что нет возможности для пользователей только на клавиатуре чтобы пропустить некоторые параметры. (Кроме того, колесо мыши, кажется, вращается по нескольким ответам, но на самом деле он запускает onChange для каждой записи, которую он передает по IE.)

Если вы действительно хотите, чтобы событие срабатывало, когда кто-то нажимал вверх или вниз, я бы подключался к событиям onKeyPress или onKeyDown для запуска всякий раз, когда нажата клавиша "вверх" или "вниз".

Ответ 2

лучше использовать .on() для привязки функции к нескольким событиям

$("#member").on("change keyup", function(){
    -----
});

Ответ 3

Возможно, вместо использования события change() используйте событие blur() и проверьте, изменилось ли значение?

FYI, я не тестировал это, просто идея, что у меня была. и я не уверен, является ли это желаемым эффектом, потому что это может привести к потере фокуса, но я предлагаю сохранить его в разных браузерах.

var currentValue;

$('.travel-to').blur(function(){
    var val = $(this).val();
    if (currentValue != val) {
        currentValue = val;
        $.ajax({
            type: "GET",
            url: "/inc/rates/rates-viewer.php",
            data: "shtech=y&c_name="+escape(currentValue),
            success: function(html){
                $(".rates-viewer").html(html);
                $(".rates-viewer tr.numbers td").css({ opacity: 0 }).fadeTo("slow",1);
            }
        });
    }
});

Ответ 4

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

Чтобы обойти это, вы можете запускать change каждый раз, когда событие keyup (пожалуйста, также предлагайте другие события?)), и выбор имеет другое значение, чем предыдущее.

var selectRegistry = {},
    $selects = $('select');

$selects.bind('change', function() {
    var $this = $(this);
    selectRegistry[$this.attr('id')] = $this.val();
});

$selects.bind('keyup scroll select', function() {
    var $this = $(this);
    if ($this.val()!=selectRegistry[$this.attr('id')])
    {
        $this.trigger('change');
    }
});

Вы можете использовать функцию .live(), если у вас будут динамически созданные элементы выбора во время выполнения веб-страницы.