Home > Article > Web Front-end > How to insert content at a specified location in JS
Below I will share with you a simple example of JS inserting content at a specified position in the text. It has a good reference value and I hope it will be helpful to everyone.
The example is as follows:
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('textarea'),document.getElementById('text').value)" />
The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.
Related articles:
How to implement collection data traversal display in AngularJS
How to integrate the carousel chart in mint-ui in vue.js
How to implement the disabled child nodes when the parent node is selected in Jstree Also selected
Adaptive processing method in Javascript
Webpack packaging configuration (detailed tutorial)
How to implement movement in vue-cli Terminal adaptive
The above is the detailed content of How to insert content at a specified location in JS. For more information, please follow other related articles on the PHP Chinese website!