Comment insérer du contenu à un emplacement spécifié dans JS

Ci-dessous, je vais partager avec vous un exemple simple d'insertion de contenu par JS à une position spécifiée dans le texte. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde.

L'exemple est le suivant :

function insertAtCursor(myField, myValue) { 
 
 //IE 浏览器 
 if (document.selection) { 
  myField.focus(); 
  sel = document.selection.createRange(); 
  sel.text = myValue; 
  sel.select(); 
 } 
 
 //FireFox、Chrome等 
 else if (myField.selectionStart || myField.selectionStart == '0') { 
  var startPos = myField.selectionStart; 
  var endPos = myField.selectionEnd; 
 
  // 保存滚动条 
  var restoreTop = myField.scrollTop; 
  myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length); 
  
  if (restoreTop > 0) { 
  myField.scrollTop = restoreTop; 
  } 
  
  myField.focus(); 
  myField.selectionStart = startPos + myValue.length; 
  myField.selectionEnd = startPos + myValue.length; 
 } else { 
  myField.value += myValue; 
  myField.focus(); 
 } 
} 
<textarea id="textarea" style="width: 386px; height: 260px"> 
</textarea> 
<input type="text" id="text" /> 
<input type="button" value="插入" onclick="insertAtCursor(document.getElementById(&#39;textarea&#39;),document.getElementById(&#39;text&#39;).value)" />

Ce qui précède est ce que j'ai compilé pour tout le monde, j'espère qu'il sera utile à tout le monde. à l'avenir.

Articles connexes :

Comment installer Mint-UI dans vue

Comment implémenter l'affichage du parcours des données de collection dans AngularJS

Comment intégrer l'image du carrousel dans mint-ui dans vue.js

Comment implémenter les nœuds enfants désactivés lorsque le nœud parent est sélectionné dans Jstree

Utilisation des filtres dans Vue

Méthode de traitement adaptatif en Javascript

Configuration du packaging Webpack (détail tutoriel)

Comment charger SVG dans Webpack

Comment implémenter le mobile dans vue-cli Terminal adaptatif

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!