Обнаружить изменение выбора в jquery mobile 1.4

Я пересматриваю JQM после того, как не использовал его для нескольких версий.

У меня есть простая коробка выбора

<select name="current-option" id="current-option" class="current-option" data-native-menu="false">
        <option>Select Option</option>
        <option value="1">option 1</option>
        <option value="2">option 2</option>
    </select>

Я хочу быть в состоянии обнаружить изменение в этом поле выбора и затем прочитать его значение. Кажется, что типичные методы jquery не работают, и я не вижу события для этого в API: http://api.jquerymobile.com/selectmenu/

5 ответов

Хорошо, вы хотите узнать значение опции, выбранной после события изменения; Вы должны сделать следующее:-

$('#current-option').change(function () {
  var optionSelected = $(this).find('option:selected');
  //var optTextSelected = optionSelected.text();
  var optValueSelected = optionSelected.val();
});

Я бы попросил вас изменить имя, идентификатор и имена классов для вашего тега выбора.

Это не в мобильной среде, а с использованием мобильных плагинов: Fiddle

HTML

<select name="current-option" id="current-option" class="current-option" data-native-menu="false">
    <option>Select Option</option>
    <option value="1">option 1</option>
    <option value="2">option 2</option>
</select>
<label id='thelabel'></label>

JavaScript

$('#current-option').change(function () {
    $('#thelabel').text($(this).val());
});

Вам нужно событие "selectmenuchange", jQuery Mobile запускает это событие для выбора вместо "изменения".

Должно получиться так:

    $('#current-option').on('selectmenuchange',function () {
       $('#thelabel').text($(this).val());
    });

Я посмотрел на DOM после создания меню выбора. Похоже, что плагин выбора меню создаст div с идентификатором, аналогичным идентификатору select; в этом случае это будет current-option-listbox, Дети этого div состоят из нескольких вещей, включая варианты. Исходя из этого, я пришел к следующему решению:

var currentValue = ""; // keep track of the selected value

$('.ui-btn-inner', '#current-option-listbox').click(function () {
    if ('a', this).text() !== currentValue) {
        // the value changed - do stuff
        currentValue = $(this).children('a').text();
    }
});

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

Вот демо-скрипка

обычно приведенный ниже код должен работать. Но я не уверен. Попробуйте, пожалуйста.

      $('#current-option').change(function () {
   $('#thelabel').text($(this).val());
});
Другие вопросы по тегам