From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../api/htmlinputelement/setrangetext/index.html | 101 +++++++++++++++++++++ 1 file changed, 101 insertions(+) create mode 100644 files/ja/web/api/htmlinputelement/setrangetext/index.html (limited to 'files/ja/web/api/htmlinputelement/setrangetext/index.html') diff --git a/files/ja/web/api/htmlinputelement/setrangetext/index.html b/files/ja/web/api/htmlinputelement/setrangetext/index.html new file mode 100644 index 0000000000..06d23ddd27 --- /dev/null +++ b/files/ja/web/api/htmlinputelement/setrangetext/index.html @@ -0,0 +1,101 @@ +--- +title: HTMLInputElement.setRangeText() +slug: Web/API/HTMLInputElement/setRangeText +tags: + - API + - HTMLInputElement +translation_of: Web/API/HTMLInputElement/setRangeText +--- +
{{APIRef("HTML DOM")}}
+ +

HTMLInputElement.setRangeText() メソッドを用いて,{{HTMLElement("input")}}や{{HTMLElement("textarea")}}要素において,文章の指定した範囲を新たな文字列で置き換えられます。

+ +

構文

+ +
element.setRangeText(置換対象);
+element.setRangeText(置換対象, 開始, 終了 [, 選択状態]);
+
+ +

引数

+ +
+
置換対象
+
挿入する文字列。
+
開始{{optional_inline}}
+
置き換える最初の文字の位置を0始まりで指定します。既定は現在のselectionStartの値(利用者が現在選択している範囲の始め)です。
+
終了{{optional_inline}}
+
置き換える最初の文字の一つ後の位置を0始まりで指定します。既定は現在のselectionEndの値(利用者が現在選択している範囲の終わり)です。
+
選択状態{{optional_inline}}
+
文章が置換された後,選択範囲がどのように振る舞うべきかを指定します。
+ 次の値が有効です: +
    +
  • select: 新規挿入した文章を選択する。
  • +
  • start: 挿入した文書の直前に選択範囲を移動する。
  • +
  • end: 挿入した文書の直後に選択範囲を移動する。
  • +
  • preserve: 選択範囲を保持しようとします。既定です。
  • +
+
+
+ +

事例

+ +

例中のボタンを押して,欄内の文章の一部を置換してみてください。新規挿入された文章は,その後強調(選択)されるでしょう。

+ +

HTML

+ +
<input type="text" id="text-box" size="18" value="この文章は更新されていません。"/>
+<button onclick="selectText()">文章を更新する</button>
+
+ +

JavaScript

+ +
function selectText() {
+  const input = document.getElementById('text-box');
+  input.focus();
+  input.setRangeText('ました', 9, 14, 'select');
+}
+ +

結果

+ +

{{EmbedLiveSample("Example")}}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("HTML WHATWG", "forms.html#dom-textarea/input-setrangetext", "HTMLInputElement.setSelectionRange()")}}{{Spec2("HTML WHATWG")}}変更なし
{{SpecName("HTML5 W3C", "forms.html#dom-textarea/input-setrangetext", "HTMLInputElement.setSelectionRange()")}}{{Spec2("HTML5 W3C")}}初回定義
+ +

ブラウザ互換性

+ +
+ + +

{{Compat("api.HTMLInputElement.setRangeText")}}

+
+ +

関連項目

+ + -- cgit v1.2.3-54-g00ecf