Этот DIV не отображается в Internet Explorer - PullRequest
0 голосов
/ 18 февраля 2009

Мне нужно сделать несколько предупреждений (например, проверки и т. Д.), И я делаю это с DIV.

Вот как я делаю проверку:

<form action="index.php" method="post" onsubmit="return validateSearchKeyword();">
        <input class="text_search" id="text_search" name="text_search" type="text" value="pesquisar" onfocus="if (this.value=='pesquisar') this.value = ''" onBlur="if (this.value=='') this.value = 'pesquisar'"  />
    </form> 

и функция проверки:

function validateSearchKeyword()
{
if (document.getElementById('text_search').value==""){creatediv('divAvisoPesquisa','You must supply a value', '355px', '125px');return false;}
}

Это функция для создания DIV:

function creatediv(id, html, left, top) {

if (document.getElementById(id)) 
    {
        //document.getElementById(id).style.display='block';
        //fadeIn(id, 300);
    }
    else
    {
        var newdiv = document.createElement('div');
        newdiv.setAttribute('id', id);
        newdiv.setAttribute("class", "warningDiv"); 
        newdiv.style.position = "absolute";
        newdiv.innerHTML = html;
        newdiv.style.left = left;
        newdiv.style.top = top;
        newdiv.style.display = "none";
        newdiv.onclick=function(e) {
            $(this).fadeOut(300, function() { $(this).remove(); });
        };  
        document.body.appendChild(newdiv);
        $("#"+id).fadeIn(300); 
    }
} 

Функции fadIn и fadeOut взяты из "jquery-1.3.1.min.js"

CSS ...

.warningDiv{
    -moz-border-radius-bottomleft:15px;
    -moz-border-radius-bottomright:15px;
    -moz-border-radius-topleft:15px;
    -moz-border-radius-topright:15px;
    font-size:11px;
    font-weight:bold;
    height:55px;
    padding:15px 25px;
    width:320px;
    z-index:100000;
    display: block;
}

Итак, это отлично работает для всех браузеров, кроме Internet Explorer. Даже проверка работает (форма не отправляется, если она не проходит проверку), но DIV не отображается. Как я могу решить это?

Спасибо

Ответы [ 2 ]

3 голосов
/ 18 февраля 2009

Я думаю, что понял. Кажется, IE не применяет классы правильно, если вы используете:

    newdiv.setAttribute("class", "warningDiv"); 

Попробуйте использовать это вместо:

    newdiv.className="warningDiv";

... Я только что проверил, и он показывает все правильные свойства CSS на панели инструментов разработчика IE, чего он не делал при использовании первого.

1 голос
/ 18 февраля 2009

Я почти уверен, что JQuery .fadeIn не работает на IE6.

Попробуйте свою функцию без эффекта затухания или измените вызов эффекта на это:

$("#"+id).fadeIn(300,function() { $(this).show(); });

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