JQuery Code适用于所有浏览器,但不适用于IE

时间:2011-05-17 22:22:16

标签: javascript jquery html internet-explorer submit

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br">

<head>

<meta http-equiv="Content-Language" content="pt-br" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />


<link type="text/css" href="css/cupertino/jquery-ui.css"
    rel="stylesheet" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/form.js"></script>

<script type="text/javascript">
    $(function() {
        $("#loginform")
                .submit(
                        function(event) {
                            event.preventDefault();
                            var data = $("#loginform").serialize();
                            $("#aviso").removeClass().addClass('messagebox')
                                    .text('Validando dados...').fadeIn(1000);
                            var options = {
                                url : 'valida.php',
                                dataType : 'json',
                                success : function(data) {
                                    if (data == 'liberado') {
                                        $("#aviso")
                                                .fadeTo(
                                                        200,
                                                        1,
                                                        function() {
                                                            $(this)
                                                                    .text(
                                                                            'Redirecionando...')
                                                                    .addClass(
                                                                            'messageboxok')
                                                                    .fadeTo(
                                                                            900,
                                                                            1,
                                                                            function() {
                                                                                $(
                                                                                        this)
                                                                                        .removeClass()
                                                                                        .html(
                                                                                                '');
                                                                                document.location = 'index.php';
                                                                            });
                                                        });
                                    } else if (data == 'bloqueado') {
                                        $("#aviso")
                                                .fadeTo(
                                                        200,
                                                        0.1,
                                                        function() {
                                                            $(this)
                                                                    .text(
                                                                            'Usuário e/ou Senha Inválidos.')
                                                                    .addClass(
                                                                            'messageboxerror')
                                                                    .fadeTo(
                                                                            900,
                                                                            1);
                                                        });
                                    }
                                }
                            }
                            $('#loginform').ajaxSubmit(options);
                            return false;
                        });
    });
</script>
<script>
    $(function() {

        $("#modal-form").dialog({

            bgiframe : false,
            width : 270,
            //width: 220,
            modal : true,
            open : function(event, ui) {
                $('.ui-dialog-titlebar-close').hide();
            }
        });
    });

    $(function() {
        $("button, input:submit").button();
    });
</script>

<style>
* {
    font-size: 14px;
}

#msgbox {
    font-family: sans-serif;
    font-size: 11px;
}

.messagebox { /*position:absolute;*/
    width: 240px;
    border: 1px solid #c93;
    background: #ffc;
    padding: 3px;
}

.messageboxok { /*position:absolute;*/
    width: 240px;
    border: 1px solid #349534;
    background: #C9FFCA;
    padding: 3px;
    font-weight: bold;
    color: #008000;
}

.messageboxerror { /*position:absolute;*/
    width: 240px;
    border: 1px solid #CC0000;
    background: #F7CBCA;
    padding: 3px;
    font-weight: bold;
    color: #CC0000;
    margin-right: 0px;
}
</style>

</head>

<body>

<div id="modal-form">
<p id="aviso"></p>
<form id="loginform" method="post" action="valida.php">
<table width="13%" cellspacing="5">
    <tr>
        <td align="right" width="20%"><b>Login:</b></td>
        <td width="65%"><input type="text" id="usuario" name="usuario"
            size="20" /></td>
    </tr>
    <tr>
        <td align="right" width="20%"><b>Senha:</b></td>
        <td width="65%"><input type="password" id="senha" name="senha"
            size="20" /></td>
    </tr>
    <tr>
        <td colspan="2">
        <p align="center"><input type="submit" id="logar" value="Logar" />
        </td>
    </tr>
</table>
</form>

</div>

</body>

</html>

1 个答案:

答案 0 :(得分:1)

你的body元素在哪里?

为什么您的脚本不在html元素中?

我怀疑,修复这些错误可以解决问题。