jQuery

Question

डालने के बाद डोम आइटम को रीफ्रेश/रीफ्रेश करने के लिए कैसे करें I पता लगाने के बाद तत्व LI को अद्यतन करने का तरीका जानने का प्रयास करें। फ़ंक्शन jQuery से पहले।

समस्या यूएल में कोई भी नया तत्व जोड़ने के बाद है, मैं तत्व को भी हटा नहीं सकता, (ईमेलटाग्रोम के साथ)।

डेमो देखें समस्या को देखने के लिए: http://jsfiddle.net/HsRfH/

<div class="content"> 
    <span class="">Please, insert one or more emails: </span> 
    <br /> 
    <ul id="ulEmailsCotacao" class="ulEmailsCotacao"> 
     <li class="liEmailTagNew"> 
      <input type="text" class="emailInputTag" name="" value="" /> 
     </li> 
    </ul> 
</div> 

---

//if enter, tab or space, add new value 
    $('.emailInputTag').keydown(function (e) { 
     var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0; 
     if (key === 13 || key === 9 || key === 32) { 
      addEmail(); 
     } 
    }); 

    addEmail = function() { 
     var email = $('.emailInputTag').val().trim(); 
     $('<li class="liEmailTagChoiced">' + email + '<a id="del" class="emailTagRemove">x</a></li>').insertBefore('.liEmailTagNew'); 
     $('.emailInputTag').val(""); 
    }; 

    $('.emailTagRemove').click(function() { 
     var email = $(this).parents("li"); 
     email.remove(); 
    }); 

Answer 1

आप तत्वों की वजह से इस बात के लिए event delegation उपयोग करने के लिए, आवश्यकता होगी जोड़ा जा रहा है/गतिशील हटाया:

$('.content').on('click', '.emailTagRemove', function() {     
     var email = $(this).parents("li"); 
     email.remove(); 
}); 

चयनकर्ता के रूप में .content का उपयोग करें इस मामले में document का उपयोग करने से टी अधिक कुशल है।

jsFiddle here

Answer 2

उन क्योंकि मौजूदा HTML को गतिशील रूप से जोड़ा तत्वों, ताकि आप document साथ on ईवेंट हैंडलर लगाव का उपयोग कर इसे सौंपने की जरूरत है।

$(document).on('click','.emailTagRemove', function() {     
       var email = $(this).parents("li"); 
       email.remove(); 
      }); 

JSFiddle

@null क्रम में बजाय स्थिर चयनकर्ता का उपयोग कर दस्तावेज़ अच्छा है, के पूरे कोड में उन तत्वों के बीच संघर्ष से बचने की ओर इशारा किया है।

$('#ulEmailsCotacao').on('click','.emailTagRemove', function() {     
       var email = $(this).parents("li"); 
       email.remove(); 
      }); 

JSFiddle