jqueryのは、私もそれを必要とする、私は「内閣の幅」の入力のための入力数を、それが=のdivクラスに「和」和を出力する場合、私は、作品次のコードを持っている他のdiv要素に</p> <p>を

Question

を合計を複製しますその合計をdivクラス= "cal1" cal2 cal3などに複製します。

これを行う方法はありますか？ここで

は一例です：JSFIDDLE

コード：

function clone() { 
 
    $(this).parents(".clonedInput").clone() 
 
    .appendTo("body") 
 
    .find("*") 
 
    .on('click', 'button.clone', clone) 
 
    .on('click', 'button.remove', remove); 
 
} 
 

 
function remove() { 
 
    $(this).parents(".clonedInput").remove(); 
 
} 
 
$("button.clone").on("click", clone); 
 

 
$("button.remove").on("click", remove); 
 

 
// calculator 
 
$(document).ready(function() { 
 
    $("body").on("keyup change", ".calculate", function(e) { 
 
    var cabwidth = parseFloat($(this).val()) || 0; 
 
    var ply = 1.4375; 
 
    var value = cabwidth - ply; 
 

 
    if (!isNaN(value) && value !== Infinity) { 
 
     $(this).parent().find(".sum").text(value); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="clonedInput"> 
 
    <input type="text" class="calculate" placeholder="Cabinet Width"> 
 
    <div class="sum"></div> 
 

 
    <div class="cal1">duplicate sum here</div> 
 
    <div class="cal2">duplicate sum here</div> 
 
    <div class="cal3">duplicate sum here</div> 
 
    <div class="cal4">duplicate sum here</div> 
 

 
    <div class="actions"> 
 
    <button class="clone">Add</button> 
 
    <button class="remove">Remove</button> 
 
    </div> 
 
</div>

Answer 1

最も簡単な解決策は、あなたが入力によって影響を受けることにしたいノードへsumクラスを追加することです。

<div class="sum cal1">duplicate sum here</div> 
<div class="sum cal2">duplicate sum here</div> 
<div class="sum cal3">duplicate sum here</div> 
<div class="sum cal4">duplicate sum here</div> 

だから、それらのすべては、あなたは

$(this).parent().find(".sum").text(value); 

Answer 2

でゲームで一度ご.find()の内部に出力するチェーン複数の要素をできるだろう。 $(this).parent().find(".sum").text(value)を
$(this).parent().find(".sum, .cal1, .cal2, .cal3, .cal4").text(value)に置き換えると、5つの要素すべてに同時に値が出力されます。

また、目的の各要素にクラスsumを追加するだけで済みます。

希望すると便利です。 :)また、このコードはfamiliarに見える

...;）

function clone() { 
 
    $(this).parents(".clonedInput").clone() 
 
    .appendTo("body") 
 
    .find("*") 
 
    .on('click', 'button.clone', clone) 
 
    .on('click', 'button.remove', remove); 
 
} 
 

 
function remove() { 
 
    $(this).parents(".clonedInput").remove(); 
 
} 
 
$("button.clone").on("click", clone); 
 

 
$("button.remove").on("click", remove); 
 

 
// calculator 
 
$(document).ready(function() { 
 
    $("body").on("keyup change", ".calculate", function(e) { 
 
    var cabwidth = parseFloat($(this).val()) || 0; 
 
    var ply = 1.4375; 
 
    var value = cabwidth - ply; 
 

 
    if (!isNaN(value) && value !== Infinity) { 
 
     $(this).parent().find(".sum, .cal1, .cal2, .cal3, .cal4").text(value); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="clonedInput"> 
 
    <input type="text" class="calculate" placeholder="Cabinet Width"> 
 
    <div class="sum"></div> 
 

 
    <div class="cal1">duplicate sum here</div> 
 
    <div class="cal2">duplicate sum here</div> 
 
    <div class="cal3">duplicate sum here</div> 
 
    <div class="cal4">duplicate sum here</div> 
 

 
    <div class="actions"> 
 
    <button class="clone">Add</button> 
 
    <button class="remove">Remove</button> 
 
    </div> 
 
</div>