-2

これを見てください

http://jsfiddle.net/tt13/CFbpt/

必要なのは、

  1. ユーザーが[+]ボタンをクリックすると、新しいテキスト入力が追加されます
  2. テキストボックスの数が3に達したときに最初のテキストボックスから+ボタンを非表示にし(ユーザーは最大2つのテキストボックスを追加できます)、テキストボックスの数が3未満のときに再表示します
  3. ユーザーがxボタンをクリックしたときに、親テキストボックス(ボタンの左側にあります)を削除します

私の+ボタンはうまく機能します:それはその場でテキストボックスを広告します。しかし、x(削除)ボタンはそうではありません。何が足りないの?

4

2 に答える 2

4

はい、ボタンが実際に存在する前に、現在削除イベントを設定していることを示しています。代わりに、削除ハンドラーを追加ボタンイベント内に配置します。

http://jsfiddle.net/CFbpt/1/

しかし、実際には、他の人が見つけられるように、コードを質問に入れる必要があります...

$(document).ready(function(){

    var addCvBtn    = $(".addCvBtn"),
    rmCvBtn    = $(".rmCvBtn"),
    rcmText     = $(".rcmText"),
    btncount    = 0,
    inputhtml = '<div class="cvInputContainer withRemBtn"><input placeholder="CV Linkini daxil edin" name="cvlinks[]" type="text" /><button class="btn btn-medium btn-danger rmCvBtn " type="button"><i class="icon-remove icon-white"></i></button></div>';

addCvBtn.click(function(){
        if(btncount == 3)  addCvBtn.hide();
        else
        {
            $(this).parent().parent().append(inputhtml);
            btncount++;
            rmCvBtn    = $(".rmCvBtn");
            $(".withRemBtn").on('click', ".rmCvBtn", function(){
               addCvBtn.show();
               $(this).parent().remove(); //EDITED
               btncount--;
               alert('deleted');
            });
        }        
    });



 });

編集:あなたが達成しようとしていたかもしれない.on()のより動的な使用法は次のとおりです:$(document).ready(function(){

    var addCvBtn    = $(".addCvBtn"),
    rmCvBtn    = $(".rmCvBtn"),
    rcmText     = $(".rcmText"),
    btncount    = 0,
    inputhtml = '<div class="cvInputContainer withRemBtn"><input placeholder="CV Linkini daxil edin" name="cvlinks[]" type="text" /><button class="btn btn-medium btn-danger rmCvBtn " type="button"><i class="icon-remove icon-white"></i></button></div>';

addCvBtn.click(function(){
        if(btncount == 3)  addCvBtn.hide();
        else
        {
            $(this).parent().parent().append(inputhtml);
            btncount++;
            rmCvBtn    = $(".rmCvBtn");
        }        
    });


 $(document).on('click', ".withRemBtn .rmCvBtn", function(){
               addCvBtn.show();
               $(this).parent().remove(); //EDITED
               btncount--;
               alert('deleted');
            });  
 });
于 2012-09-30T16:47:41.207 に答える
0

deleteでイベントを宣言する必要がありますclick。あなたのコードでは、最初に削除イベントを設定し、その後それを追加しました。'enter codeheredelete'イベントを追加するステップでbtndeleteが終了しないため、機能しません

于 2012-09-30T16:40:57.610 に答える