MooTools - Как использовать getSelected () - PullRequest
3 голосов
/ 27 июля 2010

Я пытаюсь выучить MooTools и являюсь ПОЛНЫМ javascript-новичком, поэтому, пожалуйста, будьте осторожны со мной.

Что я хочу сделать, это изменить состояние отключенного поля ввода (тип text) когда выбран конкретный вариант.HTML выглядит примерно так:

<select class="wide" id="selectBox" name="option> 
  <optgroup label="Common">
      <option value="one">One<option>
      <option value="two">Two<option>
      <option value="three">Three<option>
  </optgroup>
  <optgroup label="Less Common">
      <option value="other">Other<option>
  </optgroup>
</select>
<input id="other" type="text" disabled="disabled" />

Я надеялся, что это даст мне значение, которое будет проверено в операторе if, который затем изменит ввод с отключенного на включенный:

window.addEvent('domready', function(){
 $$('#selectBox').addEvent('change',function(){
  var selection = $$('#selectBox').getSelected();
  alert(selection);
   });
});

Когда код, который мы запускаем (т.е. я выбираю другое значение в окне параметров), все, что я получаю, это [object HTMLOptionElement].

Документация по mootools для этого метода - SPARSE и только говорит:

Метод элемента: getSelected

Возвращает выбранные параметры выбранного элемента.

Returns:

* (array) An array of the selected elements.

Примеры: HTML

<select id="country-select" name="country">
    <option value="US">United States</option
    <option value ="IT">Italy</option>
</select>

JavaScript

$('country-select').getSelected(); //Returns whatever the user selected.

Примечание:

Этот метод возвращает массив независимо от атрибута множественного числа элемента select.Если select одиночный, он вернет массив только с одним элементом.

Совершенно сбивает с толку!

Кто-то, пожалуйста, скажите мне, что мне не хватает.Я также попробовал:

var selection = $$('#selectBox').getSelected().value; //and
var selection = $$('#selectBox').getSelected('value'); //and
//a WHOLE bunch of other wild ideas including
var selection = $$('#selectBox').getSelected();
alert(selection[0]);

Ничего не получается правильно.В некоторых случаях я получаю undefined, а в других - то же [object HTMLOptionElement].

Ответы [ 6 ]

15 голосов
/ 27 июля 2010

так много вещей не так, не уверен, с чего начать.

$$() является оператором сбора (псевдоним для document.getElements(), который возвращает множители на основе селектора) - не подходит для использования с идентификатором.

Вы хотите document.id("idhere") или $("idhere")

для mootools 1.2 +

document.id('selectBox').addEvent('change',function() {
    alert(this.get("value")); // get value
    alert(this.getSelected().get("value")); // gets the option that's selected and then it's value
});

убедитесь, что вы проверили свою разметку - вы не закрываете опции, у вас также есть недостающая опция "from name =">.

getSelected используется в качестве метода, так как некоторые выборки используют множественный выбор, поэтому selectEl.get ("value") не сообщит ничего значащего. в любом другом случае .get ("value") - это нормально.

проверить работоспособность: http://www.jsfiddle.net/dimitar/SmShF/

веселитесь и читайте инструкцию:)

4 голосов
/ 03 июня 2011

поздний ответ, но я столкнулся с той же проблемой и решил ее (простым) способом в Mootools:

$('selectBox').getSelected().get('text')
2 голосов
/ 27 июля 2010

Так сложно!

Вам не нужно делать такую ​​сложную вещь, этого будет достаточно:

var selection = document.getElementById("selectBox").value;
alert(selection);

Это должно получить выбранный вами текст.

Но если вы хотите использовать mootools, я думаю , что это сработает (я не собираюсь это пробовать)

var selection = $('selectBox').getSelected();
alert(selection[0].value);

Также у этого есть некоторые проблемы:

<select class="wide" id="selectBox" name="option> 

Вам не нужен атрибут name, так как он в основном совпадает с id.Кроме того, если у вас есть оба, то они, вероятно, должны быть одинаковыми.Т.е. id="selectBox" и name="selectBox

Ваш тег name должен быть закрыт.

Также в вашем примере у вас было много <option>...<option>, которое должно быть <option>...</option>

0 голосов
/ 03 февраля 2015

.getSelected () возвращает массив. См. Документы: http://mootools.net/docs/core/Element/Element#Element:getSelected. Мой код:

var $obj=$$('#id').getSelected()[0];
alert( $obj.get('text') );
alert( $obj.get('value') );
0 голосов
/ 14 июня 2013

Быстрый, хакерский способ:

alert($('selectBox').value)

Подробный, рекомендуемый способ:

var selectBox = document.id('selectBox');
alert(selectBox.get('value'));
0 голосов
/ 09 ноября 2012

Все, что вам нужно сделать, это:

$('country-select').getSelected().get('value')[0];
...