Скрипт меняет ширину блока span в зависимости от текста, который там находится, а текст получает из select. проблема в том, что пункты select у меня выводятся из базы и selected='selected' устанавливается в зависимости от переменной. Только скрипт значение поля option selected='selected' в span не заносит. Как можно его изменить, чтобы он это делал? Сам скрипт
$(window).load(function() {
var select = $('.select');
var search = $('.search');
var wi = search.innerWidth();
select.width(wi);
$('.select').change(function(){
var name = $('.select :selected').text();
search.text(name);
var wi = search.innerWidth();
select.width(wi);
})});
Пример его работы
html:
<div class='search_box'>
<form name='search_form' action='?view=magazine_rubric' method='GET'>
<div class='button_field'>
<input name='submit' type='submit' value='' title='Найти'>
</div> <div class='select_box'>
<span class='search'>Всё</span>
<select title='Где искать' name='select' class='select'>
<option value='all'>Всё</option>
<option selected='selected' value='1'>Мужские статьи</option>
<option value='6'>Женские статьи</option>
<option value='11'>Общие статьи</option>
</select>
</div>
<div class='search_field'>
<input name='query' type='search' placeholder='Поиск по журналу' onfocus='this.select();' value=''>
</div>
</form>
</div>
Сервер выставляет selected='selected'. По умолчанию он стоит в опции "Всё". Если делать выбор вручную, то скрипт выставляет текст опции в , а если selected='selected' выставлено при загрузке странице сервером, то текст так и остаётся по умолчанию, а не меняется на тот, который обозначен selected='selected'. Но по факту сервер выставляет всё верно - в коде странице проверял. Если так понятнее)