IEブラウザに新しいテキストボックスを追加した後にテキストボックスのテキストが繰り返される

Question

最初のテキストボックスに最初にテキストを置くと、最初のテキストボックスに何か新しいテキストボックスが追加されると、次のテキストボックスにコピーされます。これはIE（IE 11でのテスト）でのみ起こります。

IEは私たちのメインブラウザですので、

IE上で動作させるにはどうすればこの問題を解決できますか？

私はそれをテストするためにhttps://jsfiddle.net/Ltzmu3p6/1/を作りました。私のオリジナルのフォームでは、他の入力テキストのすべてが問題になります。

<textarea rows="5" cols="90" id="customFields_name" class="employemnt_duties" name="employemnt_duties_1" ></textarea> 

<script> 
//for the company 
    $(".companyCF3").click(function(){ 
    var firstRow = $("#customFields_emp > tbody:first"); 
    $("#customFields_emp").append('<tbody>' + firstRow.html() + '</tbody>'); 
    //Process data 
    $("#customFields_emp > tbody:last").find('.companyCF3').remove(); 


    $("#customFields_emp > tbody:last").find('.lastitem').append('<span style="float:right"> <a href="javascript:void(0);" class="remCF3">Remove</a> </span>'); 

    var position_emp = parseInt($("#totalEmployment").val())+1; 

    $("#customFields_emp > tbody:last").find('.employemnt_duties').attr('name', 'employemnt_duties_' + position_emp.toString()); 



    $("#totalEmployment").val(parseInt($("#totalEmployment").val())+1); 
    }); 
    $("#customFields_emp").on('click','.remCF3',function(){ 
     $(this).parent().parent().parent().parent().remove(); 
     $("#totalEmployment").val(parseInt($("#totalEmployment").val())-1); 
    }); 


</script> 

Answer 1

私はあなたのfirstRowをcloneし、新しい行のためのhtmlとしてそれを追加する前に、その中にtextareaを見つけるためにあなたをお勧めします。

以下は、2行の変更点です。

var firstRow = $("#customFields_emp > tbody:first").clone(); 
firstRow.find("textarea").text(""); 

Updated fiddle