2013-07-19 5 views
0

Привет, все, что я только начинаю в JavaScript. Я попытался создать раскрывающуюся комбинацию. Но по какой-то причине это не работает.Выпадающая комбинация

Этот HTML-код:

<select id="MapSelect" onchange="changeChart();"> 
<option value="developmentRegionMap">Development Region</option> 
<option value="ecoMap">Ecological Regions</option> 
<option value="world_mill_en">Districts</option> 
</select> 


<select id="dataSelect" onchange="changeChart();"> 
<option value="CASTE1">CASTE1</option> 
<option value="CASTE2">CASTE2</option> 
</select> 

Это Java-участок;

function changeChart() { 
    var data={} 
    var value = MapSelect.options[MapSelect.selectedIndex].value; 
    var dataType = dataSelect.options[dataSelect.selectedIndex].value; 

    if (value == "developmentRegionMap" && dataType == "CASTE1") { 
      data=CASTE1_Developmental; 
      alert("APPLE"); 
     } 
    else if (value == "developmentRegionMap" && dataType == "CASTE2") { 
      data=CASTE2_Developmental; 
      alert("BALL"); 

     } 

    else if (value == "ecoMap" && dataType == "CASTE1") { 
      data=CASTE1_Eco; 
      alert("CAT"); 
     } 

    else if (value == "ecoMap" && dataType == "CASTE2") { 
      data=CASTE2_Eco; 
      alert("DOG"); 
     } 

    else if (value == "world_mill_en" && dataType == "CASTE1") { 
      data=CASTE1_Districts; 
      alert("ELEPHANT"); 
     } 

    else if (value == "world_mill_en" && dataType == "CASTE2") { 
      data=CASTE2_CASTE2; 
      alert("HEN"); 
    } 

}; 

jsfiddle ссылка на этот код: http://jsfiddle.net/4yd2F/2/

+0

Что, вероятно, не работает? Как вы можете сказать, что это не работает? Может быть, вы могли бы опубликовать некоторые ошибки? –

ответ

1

Вам нужно физически извлекать объекты DOM-вы хотите работать с:

var mapSelect = document.getElementById('MapSelect'); 
var dataSelect = document.getElementById('dataSelect'); 

Вот обновленный fiddle.

Как отметил Феликс, то, что я предложил, не было вашей основной проблемой. Другой вопрос заключается в том, что вы не правильно использовать тип javascript объекта:

Неправильно:

var data = {}; 
data = meh; 

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

Правильно:

data = { 
    myString: 'hello', 
    myArray: [] 
}; 
+1

Все основные браузеры генерируют глобальные переменные для элементов с идентификатором. Хотя мне лично это не нравится, это не проблема кода OP. –

+0

Ничего себе, не часто я узнаю что-то новое, спасибо :). Я обновляю ответ, чтобы отразить другие проблемы – epoch

1

Ваш jsFiddle демо не работает, потому что

  1. функция changeChart не является глобальной, поэтому он не может быть вызван обработчиком рядных событий (консоли Uncaught ReferenceError: changeChart is not defined),

  2. Вы сравниваете dataType против различных строк, чем CASTE1 или CASTE2, ни один из if условий никогда не будет так,

  3. много переменных, которые вы пытаетесь получить доступ, не существует (например, Brahmins_Developmental, Chhetri_Developmental).

Чтобы решить эту проблему, вы должны

  1. Место определение функции непосредственно в голове или теле HTML документа. В jsFiddle вы можете сделать это, выбрав No wrap - in <xyz> в настройках.

  2. Сравните значение второго раскрывающегося списка со значениями, которые оно имеет на самом деле, то есть CASTE1 и CASTE2 (как и в коде, который вы разместили здесь, но не в демо).

  3. Определите переменные, которые вы хотите использовать или не используете их.


Большинство из этих вещей легко решить, если вы learn how to debug JavaScript.

Смежные вопросы