2012-03-02 9 views
0

これは私の状況です。 私は最新の100のニュース記事がホームページに掲載されているニュースサイトに取り組んでいます。 お客様は、訪問者がダイアログボックスを使用してニュースにコメントを付けることができるようにしたいと考えています。 これは記事のタイトルの後に続くリンクです。 また、訪問者がログインしていないときには、ダイアログボックスを介して訪問者がそれを行うことができ、訪問者にアカウントがない場合、その訪問者に登録することができます。jquery htmlはIEの現在のhtmlを置き換えません

私が使用したダイアログボックスは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. ログインフォームと登録フォームを作成します。
  2. HTMLは次のようになりますレジスタの形式

arroundのdiv要素を作成し、ログインフォーム

  • arroundのdiv要素を作成します(内容はオランダ語であると私はそれからのコメントを残した。)

    0123:私は、ログインボタンを押したときに
    <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> 
    

    、このコードがあるだろう

    とレジスタのためにはいくつかの余分なVARSと同じコードです:

    $("#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を持つスパンを見ると決して閉じられません。

    とにかく答えが返ってきました。

  • +0

    HTMLで '#reactionForm'はどこですか?それは含まれていないようです。 – Jon

    +0

    あなたは$( '#reactionform')をhtml( '')に置き換えることができますか? – DG3

    +0

    htmlでreactionForm要素を見つけることができません。 – sandeep

    答えて

    2

    1)FORM要素をネストすることはできません。 2)あなたのDIVとFORM要素は、最後に正しい順序で閉じられません。

    これらの2つの点を最初に修正すると、すべてが魔法のように動作するはずです。

    +0

    、thnksと+1 :) – Controvi

    関連する問題