我如何取消对不是最后一个元素的事件的绑定

Question

I'm trying to make a form input that appends an empty input field to the end of a series, only if the value of the previous field is true. I'v gotten pretty far but I'm having trouble re-binding the last element.

 function removeEmpty(){ $('p:last').remove() } function init(){ $('p:last input').focus(function(event){ $(event.target).closest('p').append("<p class=''><label>middlename: </label><input></input></p>") init() }) $('p:last input').blur(function(event){ console.log($(event.target).val()) if(!$(event.target).val()){ removeEmpty() } }) } init() 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <p class="first"> <label>middlename: </label><input></input> </p> 

Answer 1

You could use the event delegation instead.

Instead of using this:

$('p:last input').focus(...); 
$('p:last input').blur(...);

you could use this:

$('body').on("focus","p:last input", function() { ... });
$('body').on("blur","p:last input", function() { ... });

I've updated your code:

function removeEmpty(){
  $('p:last').remove()
}
function init(){

    $("body").on('focus','p:last',function(event){
       var target = $(event.target);

       target.closest('p').append("<p class=''><label>middlename: </label><input></input></p>");

       target.one("blur",function() {
           if(!target.val()) {
             removeEmpty();
           }
       });
    })

 }
 init()

See http://api.jquery.com/on/ and http://api.jquery.com/one/

I guess this FIDDLE is what you want!

Answer 2

The problem is because you are using append instead of after... Use this

  $(event.target).closest('p')
  .after("<p class=''><label>middlename:</label><input></input></p>")
   init()

In addition, To select the p that is not the last: use jQuery('p').filter(':not(:last)')

And the removeEmpty must be somthing like

function removeEmpty(){
  jQuery('p').filter(':not(:first)').find('input').each(function(){
     if(!($(this).value)) $(this).closest('p').remove();
  });
}

The complete code is here