Вход

Просмотр полной версии : Как имитировать изменение свойства select?


Midel
16.06.2014, 22:18
Есть селект. На него навешено одно событие change.
Но есть ситуация (при самом заходе на страницу), что мне нужно чтобы этот change отработал и выполнил свои функции.

Что мне написать, чтобы select изменился именно на то значение которое я хочу и плюс сработало событие change?

В общем что-то похожее на .click() без параметров, которое имитирует клик.

Спасибо!

рони
16.06.2014, 22:29
Midel,
:-?
<!DOCTYPE HTML>

<html>

<head>
<title>Untitled</title>
</head>

<body>
<select id="test" name="" size="1" onchange="alert(this.value)">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<script>
document.getElementById('test').value = 2 ;
document.getElementById('test').onchange()
</script>
</body>

</html>

Sweet
16.06.2014, 22:35
.trigger() (http://api.jquery.com/trigger/)

Midel
16.06.2014, 23:04
рони,
а как это будет выглядеть на jQuery?
у меня у того элемента, который должен быть selected есть атрибут dir="myselect"

<select id="test" name="" size="1">
<option value="1">1</option>
<option value="2" dir="myselect">2</option>
<option value="3">3</option>
</select>

Midel
16.06.2014, 23:13
событие у меня задано следующим образом:
$("body").on('change', '.myselect', function() {...

рони
16.06.2014, 23:23
Midel,
$("body").on('change', '.myselect',

и где этот класс в селекте?

рони
16.06.2014, 23:25
Midel,
<!DOCTYPE HTML>

<html>

<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function ()
{
$("body").on('change', '#test', function() {alert(this.value)}) ;
$('#test').val(2).change();
})
</script>
</head>

<body>
<select id="test" name="" size="1">
<option value="1">1</option>
<option value="2" dir="myselect">2</option>
<option value="3">3</option>
</select>

</body>

</html>

Midel
16.06.2014, 23:38
Вот это не работает $('#test').val(2).change();

В общем у меня есть много селектов, у каждого класс myselect.

Внутри есть много option, и тот что нужно выбрать, у него dir=select_this

Пример:

<select class="myselect" name="" size="1">
<option value="1">1</option>
<option value="2" dir="myselect">2</option>
<option value="3">3</option>
</select>

<select class="myselect" name="" size="1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" dir="myselect">3</option>
</select>


Событие прописано так как я уже указывал, еще раз напишу:
$("body").on('change', '.myselect', function() {...

Я пытался сделать вот так, но не сработало:
$("[dir=myselect]").each(function() {
$(this).closest("select").val($(this).html()).change();
});

А так же пробовал так, тоже не срабатывает:
$("[dir=myselect]").each(function() {
$(this).closest("select")
.val($(this).html())
.trigger('change');
});

Может потому что событие прикреплено к классу?

рони
17.06.2014, 00:48
Midel,
<!DOCTYPE HTML>

<html>

<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function ()
{
$("body").on('change', '.myselect', function() {alert(this.value)});
$("[dir='myselect']").each(function()
{
$(this).parent().val(this.value).change();
}
);
}
)
</script>
</head>

<body>
<select class="myselect" name="" size="1">
<option value="1">1</option>
<option value="2" dir="myselect">2</option>
<option value="3">3</option>
</select>

<select class="myselect" name="" size="1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" dir="myselect">3</option>
</select>


</body>

Midel
17.06.2014, 09:20
$(this).parent().val(this.value).change();


так я тоже пробовал, не работает :(

рони
17.06.2014, 10:28
Midel,
тут код работает? если да то вы что-то недоговариваите)))

Midel
17.06.2014, 22:31
рони,
действительно работает, что-то до этого я наверное писал это до определения события, а может и не из-за этого..

В общем все работает и отлично, спасибо большое!)