ホームページ  >  記事  >  ウェブフロントエンド  >  JSの指定した場所にコンテンツを挿入する方法

JSの指定した場所にコンテンツを挿入する方法

亚连
亚连オリジナル
2018-06-19 11:31:033217ブラウズ

以下に、テキスト内の指定された位置にコンテンツを挿入する JS の簡単な例を紹介します。これは良い参考値であり、皆さんの役に立つことを願っています。

例は次のとおりです:

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)" />

以上は、皆さんのためにまとめたものです。

関連記事:

vueにMint-UIをインストールする方法

AngularJSでコレクションデータのトラバーサル表示を実装する方法

mint-uiのカルーセルチャートをvue.jsに統合する方法

親ノード選択時に無効化した子ノードも選択されるようにJstreeで実装する方法

Vueでのフィルターの使い方について

Javascriptでの適応処理方法

webpackのパッケージ化設定(詳細)チュートリアル)

Webpack に SVG をロードする方法

vue-cli でモバイル アダプテーションを実装する方法

以上がJSの指定した場所にコンテンツを挿入する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。