Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.08.2013, 10:15
Аватар для Fisher
Новичок на форуме
Отправить личное сообщение для Fisher Посмотреть профиль Найти все сообщения от Fisher
 
Регистрация: 11.08.2013
Сообщений: 3

Малая ширина после изменения display
При нажатии на одну из радио кнопок показывается блок, который изначально скрыт. Но в том блоке помещен select с выпадающим списком и когда я нажимаю на нужную радио кнопку то select появляется, но шириной примерно в один пиксель. Как сделать чтобы он появлялся нормальной шириной?

код:
<input size="5" type="text" value="name" name="name" id="name" />        
<input id="ooo3" onChange="javascript:disableTxt()" type="radio" value="1" name="name" />        
<input id="ooo2" onChange="javascript:disableTxt()" type="radio" value="1" name="name" />        
<input id="ooo" onChange="javascript:enableTxt()" type="radio" value="1" name="name" />        
<div id="radioo" style="display:none;">
    <select style="width:auto" size="4" name="name" id="name">
        <option value="1">Блохин Олег</option>
    </select>    
</div>

<script>
    var temp = '';
    function disableTxt() {
        var field = document.getElementById("radioo");
        if(field.value != '') {
            temp = field.value;
        }
        field.style.display = "none";
        field.value = '';
    }
    function enableTxt() {
        document.getElementById("radioo").style.display = "inline";
        document.getElementById("radioo").value = temp;
    }
</script>
Ответить с цитированием
  #2 (permalink)  
Старый 11.08.2013, 10:26
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

А браузер какой? Хром - все нормально отображается. Селект нормальной ширины.
<input size="5" type="text" value="name" name="name" id="name" />       
<input id="ooo3" onChange="javascript:disableTxt()" type="radio" value="1" name="name" />       
<input id="ooo2" onChange="javascript:disableTxt()" type="radio" value="1" name="name" />       
<input id="ooo" onChange="javascript:enableTxt()" type="radio" value="1" name="name" />       
<div id="radioo" style="display:none;">
    <select style="width:auto" size="4" name="name" id="name">
        <option value="1">Блохин Олег</option>
    </select>   
</div>

<script>
    var temp = '';
    function disableTxt() {
        var field = document.getElementById("radioo");
        if(field.value != '') {
            temp = field.value;
        }
        field.style.display = "none";
        field.value = '';
    }
    function enableTxt() {
        document.getElementById("radioo").style.display = "inline";
        document.getElementById("radioo").value = temp;
    }
</script>
Ответить с цитированием
  #3 (permalink)  
Старый 11.08.2013, 10:44
Аватар для Fisher
Новичок на форуме
Отправить личное сообщение для Fisher Посмотреть профиль Найти все сообщения от Fisher
 
Регистрация: 11.08.2013
Сообщений: 3

Цитата:
А браузер какой? Хром - все нормально отображается. Селект нормальной ширины.
Спасибо огромное, не хватило ума протестить голый пример. У меня тоже хром просто подключено расширение для селектов http://harvesthq.github.io/chosen/ . Буду под него копать...
Ответить с цитированием
  #4 (permalink)  
Старый 11.08.2013, 10:56
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Как вариант - вместо display:none пропиши класс, скажем hidden. Далее в js сразу после инициализации chosen скрой эти классы через $('.hidden').hide()
Ответить с цитированием
  #5 (permalink)  
Старый 11.08.2013, 11:09
Аватар для Fisher
Новичок на форуме
Отправить личное сообщение для Fisher Посмотреть профиль Найти все сообщения от Fisher
 
Регистрация: 11.08.2013
Сообщений: 3

Сообщение от danik.js Посмотреть сообщение
Как вариант - вместо display:none пропиши класс, скажем hidden. Далее в js сразу после инициализации chosen скрой эти классы через $('.hidden').hide()
Спасибо, работает.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите с калькулятором piton1175 AJAX и COMET 0 16.06.2011 14:29
Вызов функции после изменения данных nematod AJAX и COMET 11 21.01.2011 09:23
коррекция кода harek13 jQuery 1 16.12.2010 17:13
Как получить размер блока сразу после изменения его содержимого? Cooskon Events/DOM/Window 6 17.09.2010 16:15
ширина столбцов таблицы после загрузки bis Events/DOM/Window 1 26.03.2010 18:35