CSS style.display не работает - PullRequest
       2

CSS style.display не работает

2 голосов
/ 05 февраля 2010

У меня есть следующая функция JavaScript для отображения / скрытия строки таблицы на основе выбора списка.

function clock_Type(id) {
    var clockSource = document.getElementById("clockSource");
    var clockType = document.getElementById("clockType");

    if(id == "1") {
        if(navigator.appName == "Microsoft Internet Explorer") {
            clockType.style.display = "inline";
            clockSource.style.display = "inline";
        } else {
            clockType.style.display = "table-row";
            clockSource.style.display = "table-row";
        }
    } else {
        clockType.style.display = "none";
        clockSource.style.display = "none";
    }
}

Ниже приводится список.

<select id="clck" name="clock" class="selectStyle" style="width: 155px;" onchange="clock_Type(this.value)">
    <option value="0">Disabled</option>
    <option value="1">Enabled</option>
</select>

Это нормально работает в событии onbox списка. то есть строка таблицы становится скрытой и отображается. Но когда я пытаюсь вызвать функцию JS clock_Type () из другой функции, как показано ниже, строка таблицы не отображается.

function foo() {
   clock_Type(1);
}

Когда я отследил код, выполнение достигает следующего раздела для FireFox

clockType.style.display = "table-row";
clockSource.style.display = "table-row";

Но строка таблицы не отображается. Любая идея, что может быть проблемой здесь. Заранее спасибо!

Ответы [ 2 ]

1 голос
/ 05 февраля 2010

Установите для отображения пустую строку вместо указания "строки таблицы" или "встроенного". Это даст элементам отображение по умолчанию, поэтому, если они не указаны display:none; в таблице стилей, пользовательский агент будет согласовывать правильное отображение.

clockType.style.display = "";
clockSource.style.display = "";

Это также устраняет необходимость выполнения проверки браузера, что не является хорошей практикой.

EDIT:

Я неправильно понял ваш вопрос раньше. Тем не менее, я проверил ваш код здесь , и он, кажется, работает нормально (проверено в FF 3.5.3, Chrome 4, IE8).

0 голосов
/ 05 февраля 2010

Есть ли у элементов #clockType и #clockSource класс css, который устанавливает стиль отображения? В этом случае я попытался удалить его и установить встроенный стиль отображения.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...