jquery html不替换IE中的当前html


jquery html not replacing the current html in IE

这就是我的情况。我在一个新闻网站上工作,主页上有最新的100篇新闻文章。客户希望访问者能够通过对话框对新闻发表评论。这是文章标题后面的链接。此外,当访问者未登录时,他们可以通过对话框进行登录,当访问者没有帐户时,他可以向注册

我使用的对话框来自jquery ui。布局如下:

|---------------------------------------|
| Login           |  Registration       |
|                 |                     |
| username:       |  username:          |
| - Inputfield    |  - Inputfield       |
| password:       |  password           |
| - Inputfield    |  - Inputfield       |
| remember me     |  password confirm   |
| login button    |  - Inputfield       |
|                 |  email:             |
|                 |  - Inputfield       |
|                 |  register button    |
|---------------------------------------|
|                                       |
| Here will be all the comments for the |
| news article from newest to oldest    |
|---------------------------------------|

我在这里所做的只是创建3个div。

  1. 在登录表单和注册表单之间创建一个包装器div
  2. 在登录表单周围创建一个div
  3. 在注册表窗体周围创建div

html看起来是这样的:(内容是荷兰语,我没有注释。)

<div class="reactionForm" >
<div id="normalReaction" class="normalReaction activeForm'.(check_login() ? '' : ' login').'">
    <form action="" name="plaatsreactie" onsubmit="return validateReaction( '.$_POST['id'].');" method="post">
        <div id="reactionForm">
            <div class="qr_login">
                <h3>Log hieronder in.</h3>
                <form action="" method="post" id="reactie_login" >
                    Gebruikersnaam:<br />
                    <input id="r_username" type="text" name="gebruikersnaam" class="r_loginInput" value="" /><br />
                    Wachtwoord:<br />
                    <input id="r_password" type="password" name="wachtwoord" class="r_loginInput" value="" /><br />
                    <input id="r_onthouden" type="checkbox" name="onthouden" value="1" class="customCheckbox" id="onthoudenCheck" />
                    <label for="onthoudenCheck">Onthouden</label><br />
                    <span class="r_login_option"><a href="/wachtwoord-vergeten/" title="Wachtwoord vergeten?">Vergeten?</a>
                    <input type="image" name="submit" id="r_login" src="/images/inloggen.png" class="loginSubmit" />
                </form>
            </div>
            <div class="qr_register">
                 <h3>Nog geen account? <br />Maak hieronder een account aan.</h3>
                <form action="" method="post" id="reactie_register" >
                    Gebruikersnaam:<br />
                    <input id="r_r_username" type="text" name="gebruikersnaam" class="r_loginInput" value=""  /><br />
                    Wachtwoord:<br />
                    <input id="r_r_password" type="password" name="wachtwoord" class="r_loginInput" value="" /><br />
                    Bevestig wachtwoord:<br />
                    <input id="r_r_password2" type="password" name="wachtwoord2" class="r_loginInput" value="" /><br />
                    Email adres:<br />
                    <input id="r_r_email" type="text" name="emailadres" class="r_loginInput" value="" /><br />
                    <input id="r_r_voorwaarden" type="checkbox" name="voorwaarden" class="register_checkbox"/> Ik accepteer de <a href="/algemene-voorwaarden/" target="_blank">algemene voorwaarden</a>
                    <input type="image" name="submit" id="r_register" src="/images/registreren.png" class="loginSubmit" />
                </form>
            </div>
        </div>
    </form>
</div>

然后当我按下登录按钮时,会出现以下代码:

$("#r_login").live("click",function() { 
    var unameval = $('#r_username').val();
    var pwordval = $('#r_password').val();
    var onthoude = $('#r_onthouden').val();
    $.post( "/ajax/login.php", { gebruikersnaam: unameval, wachtwoord: pwordval, onthouden: onthoude },
    function(data){
        $('#reactionForm').html(data);            
    });
    check_login();
    return false;
});

对于寄存器是相同的代码,带有一些额外的变量:

$("#r_register").live("click",function() { 
    var unameval = $('#r_r_username').val();
    var pwordval = $('#r_r_password').val();
    var pword2val = $('#r_r_password2').val();  
    var email = $('#r_r_email').val();
    var chkbox = $('#r_r_voorwaarden:checked');
    if(chkbox.length > 0){
        var voorwaarden = 'on';    
    }else{
        var voorwaarden = 'off';
    }

    $.post( "/ajax/register.php", { gebruikersnaam: unameval, wachtwoord: pwordval, wachtwoord2: pword2val,  emailadres: email, voorwaarden: voorwaarden },
        function(data){
            $('#reactionForm').html('');
            $('#reactionForm').html(data);            
        }
    );
    return false;
});

上面我给出的关于对话框html布局的代码是当登录或注册数据错误时将返回的,并且只会为一些红色警告添加一些跨度。

但是,它并没有用新的内容(带跨度)取代当前的内容,而是取代了在线的一半

布局看起来是这样的。

|---------------------------------------|
| login button    |                     |
|                 |                     |
|         Registration                  |
|         username:                     |
|         - Inputfield                  |
|         password                      |
|         - Inputfield                  |
|         password confirm              |
|         - Inputfield                  |
|         email:                        |
|         - Inputfield                  |
|         register button               |
|---------------------------------------|
|                                       |
| Here will be all the comments for the |
| news article from newest to oldest    |
|---------------------------------------|

登录表格几乎不见了,只有按钮还在,注册表格就在下面。

我不知道你们的咒骂是否足以给我一个问题的答案,但我就是无法解决这个问题。

问候

编辑->问题已解决问题是HTML中的一个跨度没有关闭。

<label for="onthoudenCheck">Onthouden</label><br />
    <span class="r_login_option"><a href="/wachtwoord-vergeten/" title="Wachtwoord vergeten?">Vergeten?</a>
    <input type="image" name="submit" id="r_login" src="/images/inloggen.png" class="loginSubmit" />

看看带有r_login_option类的span,它从未关闭。

不管怎样,我希望得到已经给出的答案。

1)不能嵌套FORM元素。2) DIV和FORM元素最后没有按正确的顺序闭合。

先解决这两件事,它就会神奇地开始工作。