1

私はこのフォームを持っています：

<form>
  <input id="checkuser" type="text" name="user" placeholder="Your username"/>
</form>

そして、私がJQueryで行っているのは、書き込まれたユーザー名が使用可能かどうかを確認することです。これはJQueryコードです：

 $('#checkuser').click(function (){

     $(this).change(function () {
     $.ajax( {
       url: '/check',
       type: 'POST',
       cache: false,
       data: { checkuser: $(this).val() },
       dataType: "json",
       complete: function() {

    },

    success: function(data) {

        var check = JSON.stringify(data.aval);

        if (check == "false") {

            $('<p>Not available.</p>').insertAfter('#checkuser');

        }

        else {

              $('<p> Available!</p>').insertAfter('#checkuser');

        }

    },
    error: function() {

       console.log('process error');

    }
   });   
  }); 
 });

問題は次のとおりです。ユーザーが利用できない場合、ユーザーはユーザー名を書き換える必要があり、jQueryが利用可能かどうかを再確認すると<p>、JQueryのコンテンツを書き換えるのではなく、古いergo<p>の横に別のユーザーが作成されます。これが結果です。それらの1つだけを書いてください。どうすればこれを解決できますか？<p>Not available.Available!

4

3 に答える 3

2

これを解決するには<p></p>、入力の後に空白のタグを追加し、必要に応じてこのタグを更新します。

     <form>
       <input id="checkuser" type="text" name="user" placeholder="Your username"/>
       <p></p>
     </form>
     $('form p').text('Available!');
于 2012-12-29T21:20:50.890 に答える
2

insertAfterdivに新しいhtmlコンテキストを追加します。代わりに、divの後に別のdivを作成しcheckuser、内部のhtmlを置き換えます。

<input id="checkuser" type="text" name="user" placeholder="Your username"/>
<div id="msg"></div>

そしてちょうど：

$('#msg').text('your text if available or not here');
于 2012-12-29T21:20:55.180 に答える
1

insertAfter（）メソッドは設計どおりに機能しています。要素（この場合は#checkuser）を検索し、その後に新しい段落を追加します。

おそらく、次のようにINPUTタグの後にDIVまたはSPAN要素を作成する必要があります。

<span id="checkuser-validation"></span>

次に、JavaScriptコードを次のように調整します。

if (check == "false") {

        $('#checkuser-validation').Empty();
        $('#checkuser-validation').Html('Not Available');

}

... 等々。お役に立てば幸いです:)

于 2012-12-29T21:24:49.667 に答える