Установите опцию, которая будет отображаться в первой позиции с помощью jQuery - PullRequest
Новая
       22

Установите опцию, которая будет отображаться в первой позиции с помощью jQuery

2 голосов
/ 29 января 2011

У меня есть элемент select с некоторыми опциями: 

<select id="choose">
    <option id="first" value='null'>choose</option>
    <option id="g1" value='1'>gate1</option>
    <option id="g2" value='2'>gate2</option>
</select>

Пользователь выбирает опцию и отправляет форму.Данные хранятся.Каждый раз, когда пользователь возвращается, я хочу, чтобы ранее сохраненная опция отображалась в верхней части элемента выбора вместо выбора.

Я делаю это, например, таким образом 

$("#choose").val("2");

Это просто выделяетвариант в списке, но выберите все еще первый элемент.Как мне это сделать?

Ответы [ 4 ]

4 голосов
/ 29 января 2011

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

Просто привяжите к событию изменения и найдите выбранный параметр и добавьте его к #choose

var choose = $("#choose").bind('change',function(){
    choose.find('option:selected').prependTo(choose);
});

http://jsfiddle.net/petersendidit/ZuhqS/1/

1 голос
/ 29 января 2011 
var prevSelVal = 2;
if(prevSelVal!=0){
    var elem = $('#g' + prevSelVal).remove();
    $('#first').remove();
    $('#choose').prepend(elem);
}

Приведенный выше код удаляет элемент из списка и размещает его сверху.Он также удаляет элемент «выбор».

0 голосов
/ 29 января 2011

См .: http://jsbin.com/ipewe/edit Вот пример ... 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<title>Sandbox</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
body { background-color: #000; font: 16px Helvetica, Arial; color: #fff; }
</style>
</head>
<body>
  <p>Hello from JS Bin</p>
  <p id="hello"></p>
  <select>
<option value="1" >Number 1</option>
<option value="2" selected="selected">Number 2</option>
<option value="3" >Number 3</option>
<option value="4" >Number 4</option>
</select>
<script type="text/javascript">
$('option:selected', 'select').removeAttr('selected').next('option').attr('selected', 'selected');
</script>

</body>
</html>
0 голосов
/ 29 января 2011

prepend должны сделать трюк: 

var choose = $('#choose');
choose.val(2).prepend(choose.find('[value="2"]'));
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...