Wie beeinflusst man die Änderung in der ursprünglichen Eingabebox?

Question

Ich habe ein Eingabefeld gemacht und ich habe dieses Eingabefeld zu einem Div geklont, nennen wir sie ibox1 und ipbox2, ipbox2 ist die Kopie von ipbox1 was ich jetzt tun möchte ist, dass wenn ich den Wert in beiden eingeben/ändern von ihnen sollte der dom.value oder $ ("# id"). val() den aktualisierten Wert zurückgeben. Aber jetzt funktioniert es nur noch mit der ipbox2. Was soll ich tun?

fiddle

$("#ghj").click(function(){ 
 
\t $("#abc").val("Some text"); 
 
\t $("#abc").clone(true).appendTo("#pastehere"); 
 
}) 
 
$("#abc").on('change',function(){ 
 
\t alert(); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type = "text" id = "abc">This is the first box 
 
<div id = "pastehere"> 
 

 
</div>This is the cloned box 
 
<br><button type = "button" id = "ghj"> 
 
Clone 
 
</button>

Answer 1

Wenn Sie den Wert einer von ihnen in der Lage sein, unabhängig zu lesen, dann lesen Sie in diesem fiddle

Wenn nicht, dann muss ich sein aus der Bahn. Bitte fügen Sie weitere Details über das, was Sie erreichen müssen :)

HTML

<input type = "text" class = "abc">This is the first box 
<div id = "pastehere"> 

</div>This is the cloned box 
<br><button type = "button" id = "ghj"> 
Clone 
</button> 

JS

var initialInput = $(".abc"); 
$("#ghj").click(function(){ 
    initialInput.val("Some text"); 
    initialInput.clone(true).appendTo("#pastehere"); 
}) 
$(".abc").on('change',function(ev){ 
    var targetInput = $(ev.target); 
    alert('myValueIs:' + targetInput.val()) 
}); 

Answer 2

ich aktualisieren Sie Geige: https://jsfiddle.net/gschambial/s6td1bof/7/

var initVal = $('#abc').val(); 

$("#ghj").click(function(){ 
    $("#abc").val("Some text"); 
    $("#abc").clone(true).appendTo("#pastehere"); 
}) 
$("#abc").on('change',function(){ 
    alert(); 
    initVal = $(this).val(); 
}) 

$("#get").click(function(){ 
    alert(initVal); 
}) 

Answer 3

Sie sollten nicht anhängen ein geklontes Element mit einer ID, da dies zu einem ungültigen Markup führt (zwei HTML-Elemente mit derselben ID) .