элементы формы, ведущие себя необычно внутри jQuery

Question

Я использую плагин jQuery Thickbox (версия 3), и внутри него я хочу разместить форму, которая будет отправлена ​​с использованием $ .post. Но элементы формы ведут себя не так, как должны. Например, есть поле выбора

<select name="priority" id="priority">
    <?php  for($i = 5; $i > 0; $i--){    ?>                                         
           <!-- <input type="radio" class="star" name="priority" value="<?php echo $i ?>"> -->
           <option value="<?php echo $i; ?>"><?php echo $i; if($i == 5) echo ' (lowest)'; if($i == 1)echo ' (highest)'; ?></option>             
    <?php } ?>
    </select> 

когда я нажимаю на кнопку, которая вызывает функцию отправки,

function add(){   
   var pr = document.getElementById("priority").value;
   console.log(pr);

}

предупреждает только первое значение, т.е. 5 независимо от выбранного варианта.

Пожалуйста, помогите. Это часто встречающаяся проблема?

Answer 1

С jQuery:

var pr = $("#priority option:selected").val();

Если вы хотите использовать чистый JavaScript, вы должны уметь:

var i = document.getElementById("priority").selectedIndex;
var options = document.getElementById("priority").options;

var value = options[i].value;

Answer 2

Я не знаю толщину, но проблемы с формами являются общими для многих инструментов типа лайтбоксов. Причина в том, что инструмент 1. выводит элементы формы из контекста формы и 2. обычно копирует их в Thickbox / Lightbox / что угодно на уровне DOM. Когда окно закрывается, элемент уничтожается или сбрасывается, а не перемещается обратно в форму с сохранением любых измененных настроек.

Обычно возможно изменить это поведение, но только путем изменения самого сценария * box, чтобы он безопасно передавал элементы DOM туда и обратно.

Answer 3

Поскольку вы используете jQuery, вы должны использовать

var pr = $("#priority option:selected").val();

или

var pr = $("#priority").val();

вместо

var pr = document.getElementById("priority").value;

это должно решить

см. http://docs.jquery.com/Attributes/val для получения дополнительной информации