Funktionsparameter, der bewirkt, dass der Cursor springt. .keyup

Question

Ich habe diese Funktion, die Daten über Diff-Textarea übergeben soll, der Cursor springt jedoch bis zum Ende des Textes.

function KeepReferencesInSync(referenceInput) { 
    $(referenceInput).keyup(function() { 
    $("input[name=Reference]").val($(this).val()); 
    } 
)} 

Answer 1

bekam ich eine Lösung.

Ich musste die Cursorposition aufzeichnen und [setSelectionRange] setzen, um sicherzustellen, dass der Cursor nicht springt. Siehe unten.

function KeepReferencesInSync(referenceInput) { 
    $(referenceInput).on('keyup', function() { 

     //get selection position 
     var start = this.selectionStart, 
     end = this.selectionEnd; 

     $("input[name=Reference]").val($(this).val()); 

     //set the range 
     this.setSelectionRange(start, end); 
    }) 
} 

Answer 2

Sie können diesen Ansatz versuchen. Es ist nicht State-of-the-Art, aber das funktioniert.

// Create a list of zone/input/ele 
 
var zoneList = [$('#zone1'),$('#zone2'),$('#zone3')]; 
 

 
// For each zone 
 
$.each(zoneList, function(index, zoneForEvent){ 
 
    // Attach keyup event 
 
    zoneForEvent.on('keyup',function(){ 
 
     // Get root zone info who trigger event 
 
     var rootZoneId = this.id; 
 
     var rootZoneValue = this.value; 
 
     // Loop on each zone 
 
     $.each(zoneList, function(index, zoneDestination){ 
 
      // If zone destination is not root zone 
 
      if (zoneDestination.id !== rootZoneId) { 
 
       // Copy value of root element 
 
       zoneDestination.val(rootZoneValue); 
 
      } 
 
     });  
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea id="zone1"></textarea> 
 
<input type="text" id="zone2"></input> 
 
<textarea id="zone3"></textarea>