Почему не выводится value в change функции?

Question

[del993788]

<select id="my_select" name="my_select">
<option name="raz" value="Машины">Авто</option>
<option name="raz" value="Дома">Недвижимость</option>
</select>
<h3></h3>

$("#my_select").change(function ()
    {
      var razmer = document.getElementsByName('raz').value;
      $("h3").text(razmer);
    }
  )

Подскажите, что ему мешает вывести в h3 value?

Answer 1

[Mr Crabbz]

var razmer = document.getElementsByName('raz').value; - что это за полу javascript, полу jquery на ровном месте то?

$("#my_select").change(function ()
    {
      var razmer = $("#my_select").val();
      $("h3").text(razmer);
    }
  )

Comments

[Назар Мокринский]

Так пишете, вроде jQuery не JS

[Mr Crabbz]

Назар Мокринский: Я этого не говорил. Просто как-то не красиво чтоли в одной строчке выбирать элемент через селектор jQuery и тут же в другой городить огород из document.getElement....
Красоту кода же нужно тоже поддерживать стараться :)

[del993788]

Подскажите, а как сделать переменную глобальной? То есть мне нужно еще в другие строчки добавить эту переменную. Если я просто напишу в начале var razmer = $("#my_select").val(); ,то при смене select, value отображаться не будет.

Answer 2

[Иван Волков]

ибо с тегом - <select> всё чуток по другому (google it -> "html select get selected value"):

$("#my_select").change(function() {
        var e = document.getElementById("my_select");
        var razmer = e.options[e.selectedIndex].value;

        $("h3").text(razmer);
    }
 );

но это действительно смесь JS и jQuery, разберитесь с этим моментом, ибо так никто не делает.
либо на чистом JS:

function addEvent(e, type, handler) {
  if (e.addEventListener) {
    e.addEventListener(type, handler, false)
  } else {
    e.attachEvent("on"+type, handler)
  }
}

var select = document.getElementById("my_select");
addEvent(select, "change", function() {
    var razmer = this.options[this.selectedIndex].value;
    document.getElementsByTagName("h3")[0].innerHTML = razmer;
});

либо на jQuery, как показали выше