No puedo editar el texto en la capa después de agregar una nueva capa usando kineticjs

He hecho este http://jsfiddle.net/62Wjc/5/ , crear y cambiar texto en la capa pero es estático. Ahora hago un script para agregar campos dynamics + agregar capa + cambiar capa.

En mi script tienen tres funciones, que son:

  1. Función CreateTxt para crear elementos y crear capas con KineticJS.
  2. Función fRField para eliminar elemento
  3. Función ChangeTxt para cambiar el texto en la capa.

Y este mi guión:

 $(document).ready(function() { var nwValue = []; var nwLayer = {}; var nwTxt = {}; var tulisan = 'Your text here'; var con = $('#idEditor'); var cW = con.width(); var cH = con.height(); var stage = new Kinetic.Stage({ container: 'idEditor', width: cW, height: cH }); $('a[data-selector="get_new_txt"], a[data-selector="get_new_img"]').on('click', function(event){ var time = new Date().getTime(); var regexp = new RegExp($(this).data('id'), 'g'); $('#nF').append($(this).data('fields').replace(regexp, time)); CreateTxt(time); event.preventDefault(); }); $('#nF').on('click', 'a[data-selector="removeField"]', function(e) { var a = $(this); fRField(a); e.preventDefault(); }); $('#nF').on('keyup', 'input[data-selector="inputName"]', function() { var a = $(this); ChangeTxt(a); }); function CreateTxt(idV) { var iclone = 0; nwValue.push(idV); $.each(nwValue, function( index, value ){ nwLayer["layer"+ value] = new Kinetic.Layer(); }); stage.add(nwLayer["layer"+ idV]); $.each(nwValue, function( index, value ){ nwTxt["text"+ value] = new Kinetic.Text({ x: 100, y: 100, text: "Your text here", fontSize:18, fill: 'red', draggable: true, id: 'txt'+ value }); }); nwLayer["layer"+ idV].add(nwTxt["text"+ idV]); nwLayer["layer"+ idV].draw(); } function fRField(a){ if(confirm('Are you sure to delete this field ?')) { a.prev("input[type=hidden]").value = "1"; a.closest(".form-inline").remove(); } return false; } function ChangeTxt(a){ var dataid = a.attr('data-id'); var newValue = a.val(); nwTxt["text"+ dataid].setText(newValue); nwLayer["layer"+ dataid].draw(); } }); 

jsfiddle: http://jsfiddle.net/8oLsoo25/5/

Después de agregar un nuevo texto, no puedo cambiar el texto en la capa primero.

Su $.each llamada para nwValue está arruinando las cosas para usted. Si coloca nwValue = []; encima de nwValue.push(idV); en CreateTxt , todo funciona como se espera. En otras palabras, está reemplazando las referencias a los objetos originales. Además, ¿sabe que una nueva Capa en Kinetic significa un nuevo elemento de canvas en el DOM?