• 締切済み

textareaの選択された文字列の取得

HTMLエディタを作ろうとしています。 textAreaの選択された文字列の開始桁数・終了桁数を取得するにはどのようにすればよいのでしょうか? var selected_text; if (document.getSelection) // Moz { selected_text = document.getSelection(); } else if (document.selection && document.selection.createRange) // IE { rng = document.selection.createRange(); selected_text = rng.text; } alert(selected_text); これで、選択された内容は取得できたのですが、初めと終了の桁数が取れていません。 クロスブラウザに対応したく、IE6以上、FF3、Opera9.5、Safari3.1、Choromeにて動作を確認したいのですが、お分かりになる方いましたら、よろしくお願いします。

みんなの回答

noname#84373
noname#84373
回答No.1

関連するQ&A

  • GoogleChromeで選択文字列を取得する方法を教えて下さい。

    GoogleChromeで選択文字列を取得する方法を教えて下さい。 GoogleChromeでページ内で選択した文字列を取得し、表示させるプログラムを作成しています。 いろいろ検索してみたところ、window.getSelection()+''; のようにすれば取得できるようなことが書いて あったんですが、うまくいきませんでした。 function test() { var selection = window.getSelection()+''; return selection; } もちろん window.getSelection() でも駄目でした。 わかる方いらっしゃいましたら、教えて頂けると嬉しいです。

  • HTML内から画面で選択した文字列のIDを取得する方法

    こんばんは。 質問させて下さい。 例えば以下のようなHTMLを出力し、 なんらかのタグでNAMEを付けておきます。 ---<HTMLファイルここから       : <XXX NAME="ID001"></XXX>ようこそJavaScriptへ。 <XXX NAME="ID002"></XXX>うまく表示されているでしょうか? <XXX NAME="ID003"></XXX>たまたま表示されているだけでしょうか?       : <XXX NAME="IDnnn"></XXX>これはテスト文字列です。       : ---<HTMLファイルここまで この時に、「たまたま表示されている」をマウスで範囲選択し、 document.selection.createRange().textや window.getSelection().toStringなどで文字列を取得して、 XXXタグのNAMEよりID003を拾うには どういったやり方があるでしょうか?

  • 【Android】WebViewのテキスト選択

    アプリ開発を行っているものです。 WebViewでテキスト選択した文字列を色を変えたりなど、色々操作したいと考えています。 JavaScriptを呼び出し、document.selectionなどを使用して操作しようとしています。 JavaScripの呼出まではできているのですが、選択文字列が全く取れません・・・ 下記がAndroid側とJavaScriptです。 WebViewのテキスト選択は長押しで出てくる標準機能で選択状態にしています。 <andoriod> ボタンを押下すると下記を呼び出す mWebView.loadUrl("javascript: test()"); <Javascript> function test() { var str=(document.all)?document.selection.createRange().text:(window.getSelection()+''); if(str!=''){ document.body.innerHTML=document.body.innerHTML.replace(str,'<font color="black" style="background:#ffff00;padding:5;">'+str+'</font>'); } else { str = 'sample' } Log.i("selected str",str); } 上記のプログラムでJavaScriptをPCのブラウザ(IEなど)で試すと選択文字列の色が変わります。 現状では、ログをみると選択文字列が取れてません(sampleという文字列が表示されているので) 何か方法があれば教えてください。 よろしくお願いいたします。

  • 選んだ文字列を表示させる方法について

    JavaScriptを使って,ドラッグで選んだ文字列を,同じページ内に,抜き出して表示させることを考えています。 いろいろなページを参考にして,以下のように作ってみましたが,どうもうまく動きません。 具体的には,文字を選ぶと[object]と表示されてしまいます。 アドバイスをお願いします。 <html lang="ja"> <head> <script type="text/javascript"> function doAlert(){ if(document.all){ var s = new String; s=document.selection.createRange(); if (document.all) { his.innerHTML = s; } else if ( document.layers ) { document.his.document.open(); document.his.document.write(s); document.his.document.close(); } }else if(document.getElementById){ s=window.getSelection(); document.write(s); } } document.onmouseup=doAlert; </script> </head> <body> <div id="div1" style="font-size:24pt"> 選択してください。 </div> <hr> <DIV id="his" style="position: absolute;"> <P>上の文をドラッグすると,ここに選んだ文字列が表示されます</P> <hr> </DIV> </body> </html>

  • 選択した部分を新しいウィンドウで開く方法

    選択した部分をkeyを押して新しいウィンドウで開くスクリプトを作っているんですが、下記のような形でIEの方はできたのですが、firefoxでkeycodeを取得してやる方法がよくわかりませんので、教えてください。 よろしくおねがいします。 function getSelect(){  if(navigator.appName == "Microsoft Internet Explorer"){   if(event.keyCode == ○○○○){    xx = document.selection.createRange();    window.open("http://○○○○/" + xx.text , "new" , "");   }  } } document.onkeydown = getSelect;

  • DMM検索のブックマークレット出来ませんか?

    google検索の javascript:(function(){x=document;y=window;if(x.selection) {Q=x.selection.createRange().text;} else if (y.getSelection) {Q=y.getSelection();} else if (x.getSelection) {Q=x.getSelection();};m='http://www.google.co.jp/search?hl=ja&q='+encodeURIComponent(Q)+'&lr=lang_ja';y.open(m,'_blank','');})(); みたいな DMMの月額レンタル検索をできませんか http://www.dmm.com/search/=/category=rental/searchstr=BA__/analyze=V1EAAFYHUQs_/

  • お気に入りから小窓を開く

    お気に入りに追加することで、ポップアップ画面をだすほうほうをやりたいのですが サンプルや開設ページがみつかりません。 たまに、開設ではなく、それを利用したものをみるのですが、 mac/safari.foirefoxでできるものがありません。 唯一、ジュゲムのものが、マックでも使用できました。↓ javascript:t=document.title;u=location.href;if(document.selection){d=document.selection.createRange().text;}else%20if(document.getSelection){d=document.getSelection();}else%20if(window.getSelection){d=window.getSelection();}else{d='';}w=window.open('http://xxx.jugem.jp/admin/?mode=bookmarklet&t='+t+'&u='+u+'&d='+d,'bookmarklet','scrollbars=yes,width=600,height=600,status=yes,resizable=yes,scrollbars=yes');w.focus(); これはhttp://jugem.jp/support/faq.php#29 のもので、記事の内容とかを簡単に引用できるもなんですが そういう事はする必要はなく ただ、単純に お気に入りから、ポップアップで、htmlを表示したいのですが http:のところを、変更しても、使えませんでした。 なにかサンプルがあれば、アドバイスお願いします。

  • ●excite英日、日英の頁翻訳ではなく、選択テキスト(長文対応)を新しいウィンドウに結果表示させるブックマークレットとは?

    ●下記頁にexcite英日のブックマークレットがありますが これを新しいウィンドウで開く為には、どのように修正すればよいのでしょうか? http://www.excite.co.jp/world/bookmarklet/ javascript:(function(){var%20b=((window.getSelection&&window.getSelection())||(document.getSelection&&document.getSelection())||(document.selection&&document.selection.createRange&&document.selection.createRange().text));if(b!=''){location.href='http://www.excite.co.jp/world/english/?before='+encodeURIComponent(b)+'&wb_lp=ENJA&ie=UTF-8';}else{location.href='http://www.excite.co.jp/world/english/web/?wb_url='+encodeURIComponent(location.href)+'&wb_lp=ENJA';}})(); ●私のイメージとしては 下記頁の最下部にある"選択範囲をExciteで邦訳する(IE版)"が近いのですが 惜しい事に、長文選択の場合、上記ブックマークレットのようには翻訳できないようです。 http://confetto.s31.xrea.com/misc/bookmarklets/tool javascript:(function(){var d=document,b=d.body,f=d.createElement('form'),p=f.appendChild(d.createElement('p')),i=p.appendChild(d.createElement('input')),t=p.appendChild(d.createElement('textarea'));f.action='http://www.excite.co.jp/world/english/';f.method='post';f.target='_blank';f.style.display='none';i.name ='wb_lp';i.value='ENJA';t.name ='before';t.appendChild(d.createTextNode(d.selection.createRange().text));b.appendChild(f);f.submit();b.removeChild(f)})() ●excite英日、日英の頁翻訳ではなく 選択テキスト(長文対応可!)を新しいウィンドウに結果表示させるブックマークレットを教えて下さい よろしくお願い致します。m(_ _)m

  • 関数化のやり方

    function bold(){ if(document.all){ //IE var str=document.selection.createRange().text; if (str != "") { document.selection.createRange().text="<b>" + str + "</b>"; } else { document.form1.CBBE_TEXT.value += "<b></b>" } } else { //Firefox var el=document.getElementById('text'); var sPos = el.selectionStart; var ePos = el.selectionEnd; var str = el.value.substring(sPos, ePos); el.value = el.value.substring(0, sPos) + "<b>" + str + "</b>" + el.value.substr(ePos); } } function italic(){ if(document.all){ //IE var str=document.selection.createRange().text; if (str != "") { document.selection.createRange().text="<i>" + str + "</i>"; } else { document.form1.CBBE_TEXT.value += "<i></i>" } } else { //Firefox var el=document.getElementById('text'); var sPos = el.selectionStart; var ePos = el.selectionEnd; var str = el.value.substring(sPos, ePos); el.value = el.value.substring(0, sPos) + "<i>" + str + "</i>" + el.value.substr(ePos); } } を <input type="button" value="太字" onclick="bold()"> <input type="button" value="斜字" onclick="italic()"> で制御しています。 関数化できませんか?

  • Javascriptで動的に変更した点を保存して、ページを更新したときに また再現したいです

    初心者です。よろしくお願いします。 マウスで文字列を選択して、反転した部分の文字をスタイルで大きくする… という簡単な Javascript を作りました。 このページを更新・リロードすれば、当然変更された部分も元に戻ってしまいますが、 この変更部分を PHP に送ってファイルに保存し、今度呼び出されたとき変更した部分を再現したいと思っています。 ただその文字列の位置などをどうやって保存するか、またどうやって再現するのかがよく分かりません。 コードは以下のような感じです ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ <html> <head> <script language="JavaScript"><!-- function test(){ if (!document.selection.createRange().text) return; var rng = document.selection.createRange(); var selectedText = rng.text; //選択された文字列 //選択された文字を大きくするだけでいいです。複雑なことはしません。 rng.pasteHTML('<span style="font-size: 160%;">'+selectedText+'</span>'); oRange = document.body.createTextRange(); var moji_nagasa = rng.text.length; //ページ中の文字列の位置を探そうとしています。 rng.moveEnd("textedit");//選択範囲の終端をページの最後まで持って行き、 moji_nagasa += rng.text.length;//文字列の位置を保存したい…この辺りが再現するときうまく働きません //↓書きませんが、適当にphpかperlに送って選択文字列のデータと位置を保存しています sampleAjax ( selectedText, oRange.text.length - moji_nagasa ); } // --></script> </head> <body onContextmenu="test()"> 文字列を選択して↑右クリックを押すと選択文字列を変更します。 OKWave 「文字列」「文字列」「文字列」 </body> </html> ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ 上記の通り「文字列」という同じ言葉が何度も使われていると match や RegExp だと全て大きくなってしまいます。 また rng.moveStart("character", -1); rng.moveEnd("character", 1); などで再現しようと思っているのですが、改行文字を飛ばしているのかどうか分かりませんが、うまく動かないので、再現できません。 目的はただ、好きな文字列を選択して強調した部分を、今度ページを見たときもいつでも何を強調したか分かるようにしたい…というだけです。 どうか詳しい方お力をお貸しください。よろしくお願いしますm(_ _)m

専門家に質問してみよう