एक साथ संलग्न करें और स्लाइड करें jQuery

Question

मेरे पास यह ऐपेंड विधि है जिसे मैंने अधिक इनपुट बॉक्स जोड़ने के लिए बनाया है जब तक कि उनमें से 10 नहीं हैं जो अधिक बनाने में अक्षम हो जाएंगे।

i = 0; 
$('#add-link').click(function() 
{ 
    if(i < 9) 
    { 
     $('.insert-links').append('<div class="new-link" name="link[]"><input type="text" /></div>'); 
     i++; 
    } 
    if(i == 9) 
    { 
     $('#add-link').html('');  
    } 
}); 

हालांकि, यह अच्छा है। हालांकि, मैं जब संलग्न एक slideDown लागू करना चाहते हैं, मैं यह कर की कोशिश की है:

$('.insert-links').append('<div class="new-link" name="link[]"><input type="text" /></div>').slideDown("fast"); 

कौन सा बिल्कुल काम नहीं करता है।

Answer 1

तरह SimpleCoder के समाधान, लेकिन केवल एक appendTo() का उपयोग कर लाइन में:

$('<div style="display: none;" class="new-link" name="link[]"><input type="text" /></div>').appendTo($('.insert-links')).slideDown("fast"); 

डेमो: http://jsfiddle.net/V4SVt/336/

Answer 2

append() मूल चयनकर्ता का संदर्भ देता है, जो कि जोड़ा गया था। मुझे लगता है कि आप इस के लिए देख रहे हैं:

$('.insert-links').append('<div style="display: none;" class="new-link" name="link[]"><input type="text" /></div>') 
$('.insert-links').find(".new-link:last").slideDown("fast"); 

लाइव डेमो:

http://jsfiddle.net/V4SVt/2/

Answer 3

हालांकि SimpleCoder के समाधान पूरी तरह से वैध है, मैं इसे इस तरह करना चाहते हैं:

i = 0; 
$('#add-link').click(function() { 
    if(i < 9) { 
     $('.insert-links').append('<div style="display: none;" class="new-link link_' + i + '" name="link[]"><input type="text" /></div>'); 
     $('.link_' + i).slideDown("fast"); 
     i++; 
    } 
    if(i == 9) { 
     $('#add-link').fadeOut('200'); 
    } 
}); 

इसका कारण यह होगा कि प्रत्येक लिंक input को दूसरी कक्षा के रूप में एक आईडी प्राप्त होगी, जो कि अगर कोई तत्व निकालना चाहता है तो उन्हें चुनने के लिए बहुत आसान होगा, क्या किसी को गलती से एक से अधिक जरूरतों को जोड़ना चाहिए। मैंने add-link तत्व पर एक फीका आउट प्रभाव भी जोड़ा है ताकि उपयोगकर्ता भ्रमित न हो कि यह गायब हो गया है। बेशक, यह सिर्फ व्यक्तिगत स्वाद का मामला है, लेकिन मुझे यह अधिक उपयोगकर्ता के अनुकूल लगता है।

उम्मीद है कि इससे मदद मिलती है।