jquery - トグル（）機能を正しく使用する方法

Question

フォームを変更するtoggle（）スクリプトがあります。ユーザーが行うことは、IDが「comp」の画像をクリックすることです。これにより、ラベルがNew Companyに変更され、選択ドロップダウンがテキスト入力に変更されます。しかし、元の状態に戻るようにするにはどうすればよいですか？

<script>
$(document).ready(function() {
    $('#newcomp').click(function() {
        $('select#company').toggle(); 
        $('select#company').replaceWith("<input type='text' id='company' name='company' >");
        $('#comp label').replaceWith('<label for="company">New Company</label>')
    });
});
</script>

よろしくガンビット

Answer 1

私はあなたがしたいことだと思います fadeOut->replace->fadeIn.

$(document).ready(function () {
    $('#newcomp').click(function () {
        $('select#company').fadeOut('slow', function() {
             $('#comp label').replaceWith('<label for="company">New Company</label>');
             $(this).replaceWith("<input type='text' id='company' name='company' >").fadeIn('slow');
         });
    });
});