• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:IE8でdivのcontenteditable=trueでの擬似テキス)

IE8でdivのcontenteditable=trueでの擬似テキストボックス内からキャレット位置を取得する方法

yamada_gの回答

  • yamada_g
  • ベストアンサー率68% (258/374)
回答No.1

自分の環境もIE8ですがエラーにならずにちゃんと動きました。 <html> <head> <script type="text/javascript"> function test() { var elem = document.getElementById("chatitlename2"); elem.focus(); var range = document.selection.createRange(); alert(range); } </script> </head> <body> <div id='chatitlename2' contenteditable=true> </div> <button onclick="test();" >ボタン</button> </body> その他の環境の違いによる影響なのでしょうか。 ちなみの当方の環境は IE:8.0.6001.18702 OS:WindowsXP Professional SP3 です。

hiroasa21
質問者

お礼

残念ながら、この件につきましては解決致しませんでしたので、 別の技術に仕様を変更することに致しました。 いろいろとアドバイスをいただきまして、 本当にありがとうございました。

hiroasa21
質問者

補足

「yamada_g」様、ご回答ありがとうございます。 参考までに、私の環境(IE8、WindowsXP Professional SP3)も下記致します。 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" errorPage="../error/FormSystemError.jsp" %> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>xxシステム</title> <link rel="stylesheet" type="text/css" href="./style.css"> <script language="JavaScript"> <!-- 上記のような環境になっております。 もし、何かお気づきの点などございましたら、 ぜひアドバイス願います。 宜しくお願い致します。 hiroasa21。

関連するQ&A

  • お世話になります。contenteditable=trueで、

    お世話になります。contenteditable=trueで、 (IE8上にて、divでの擬似テキストボックス) JavaScript上からテキストデータとして、 「Q&A」という文字列を、innerHTMLでセットしたところ、 「Q」までは、文字列が画面上にセットされるのですが、 その先の「&A」がセットされません。 (画面上からも入力出来ません) どのような方法でセットすれば、 「Q&A」という文字列をセットすることが可能になるのでしょうか? (JavaScript上からのinnerHTML、および画面上からの手入力時) 以上になります。 宜しくお願い致します。

  • お世話になります。「質問番号:6100202」と並行して、別の質問をさ

    お世話になります。「質問番号:6100202」と並行して、別の質問をさせていただきます。 宜しくお願い致します。 IE8でdivのcontenteditable=trueでの擬似テキストボックス内と、通常テキストエリア内へ それぞれ任意の文字列を手入力した後で、 入力チェックエラーとして、別のページ画面(エラーメッセージ)を表示させて、 その画面上の[戻る]ボタンをクリックして、 元のページ画面へ戻すプログラムを作成して動かしてみたところ、 通常テキストエリア内へ任意の文字列を手入力した方は、 その任意の文字列の内容のままで残って正しく表示されましたが、 IE8でdivのcontenteditable=trueでの擬似テキストボックス内へ 任意の文字列を手入力した方は、 任意の文字列内容は無くなっていて、 その元のページ画面を、一番最初に開いた際の初期値(文字列)が表示されてしまいました。 そこでご質問内容ですが、 別のページ画面から、元のページ画面に戻った際に、 IE8でdivのcontenteditable=trueでの擬似テキストボックス内へ 任意の文字列を手入力した値を、キープして、 その任意の文字列の内容のまま残すには、 どのような方法がよいのでしょうか?

  • div要素内の全input要素をdisable

    Javascriptで、あるdiv要素内のチェックボックスやテキストフィールドなどのinput要素を すべてdisableにしたいです。 以下でうまくいきません。どなたかお知恵を頂けないでしょうか? よろしくお願い致します。 var input_tags = document.getElementById("div_id").getElementsByTagName("input"); for(var input_tag in input_tags) { input_tag.disabled = true; }

  • Safari find()で次のテキストを検索、Firefox find()で最初から検索

    Safariのfind()についてです。 Firefoxのfind()は、キャレットやフォーカスの位置から検索を開始し、 find()で見付かるとフォーカスを移動させますが、 Safariでは常にドキュメントの最初から検索します。 これを次々と検索していく方法はあるでしょうか。 <body> test test </body> <script> var word='test'; var cnt=0; while(find(word)){ //Safariでは無限ループになる cnt++; } alert(''+cnt); </script> これはmatchなどでも作れますが、BBS投稿用のサンプルですので、 find()を使った方法を探しています。 また、Firefoxのfind()で、最初から検索し直す方法も探していますが、 現在は while(find(word,false,true)) ; で、ドキュメントの最初まで検索していき、あらためて検索をし直す、という方法を採っています。 これを、一発で最初に戻すような方法はないでしょうか。 var sel=document.createRange(); sel.collapse(document.body, true); var sel=document.createRange(); sel.setStart(document.body, 0); sel.setEnd(document.body, 0); これらではfind()が最初から検索しなおすことはありませんでした。

  • DIVタグでの擬似インラインフレーム

    <DIV>タグで擬似インラインフレームを実現させようと思っています。 <DIV>タグ内に<table>タグがあって、<td>タグ内に<A>タグテキストリンクがある場合に、そのリンクを右クリックしてプロパティを表示させると、 <DIV>タグの位置がずれてしまいます。 ・動作テスト OS:WindowsXP SP1 ブラウザ:IE6 ・テキストリンク<a>タグを右クリックしてプロパティを表示させたときのみ発生する。 ・NN7.1では発生しません。 原因がまったくわかりません。 簡単な例↓ <DIV style="width:640px;height:350px;overflow:scroll;"> <table width=620px><tr><td><A href=http://www.yahoo.co.jp>YAHOO</A></td></tr></table> </DIV> 以上のような感じです。 しかし、実際に操作していただくと、何が問題なのかがわかると思いますので、以下のページを参照してください。 http://members3.jcom.home.ne.jp/takokko/divframetest.html 大変困っております。なにとぞ、宜しくお願いいたします。

    • ベストアンサー
    • HTML
  • 疑似インラインフレームを中央に配置する方法

    疑似インラインフレームを中央に配置する方法 疑似インラインフレームを画面中央に配置する方法を教えてください。 ちなみに、以下のような記述を試してみたのですが…。 【css】 body { text-align: center; margin-top: 100px; color: #555555; font-size: 10px; font-family: "MS Pゴシック"; } *{ margin:0px; border:0px; padding:0px; line-height:100%; } .box{ text-align: center; padding-bottom: 50px; } .box_scroll{ text-align: center; width: 300px; height: 200px; padding: 10px 10px; overflow: auto; } 【xhtml】 <div class="box"> <img src="img.jpg" width="100" height="50" alt="img" /> </div> <div class="box"> <div class="box_scroll"> ---文章--- </div> </div> 初めの<div class="box">は中央に配置されるのですが、疑似インラインの部分は左に寄ってしまいます。 他にも他の方の質問を参考に試してみたのですが、初心者の為いまいちよくわからず、うまくいきませんでした。 どうか回答よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • C# htmlの一部の文字取得

    C#のwebBrowserで表示されているtextを表示させたいです。 htmlが <div class="AAA"> BBB </div> となっており、BBBのtextを取得したい場合、 HtmlElementCollection elem = webBrowser0.Document.GetElementsByTagName("div");   foreach (HtmlElement element in elem)   {    if (element.GetAttribute("class") == "AAA")  {  str = element.InnerText;  } } と、しましたが、上手く取得出来ません。 ご教授頂ければ助かります。

  • IE6だけの判定、IE7だけの判定について

    こんにちは。 下記の「IE6だけの判定方法(JavaScript)」で、どれが一番いいのか、 或は、もっと正確で簡素な良い方法があるのかどうかを教えてください。 また、IE7だけの判定方法も記載しますので、ご指導お願いします。 色々試した結果は、一応全部OKでした。 ただ、プログラマーでないので心配なので質問させて頂きました。 もうひとつ、!!は何かundefinedやfunctionを、true、falseへと整形してるようですが、 これを、業界用語で何って言うのかも、教えてください。よろしくお願いします。 <script> /* IE6だけの判定方法 */ // (1) var ua = navigator.userAgent.toLowerCase(); var bver = (ua.match(/.+(?:rv|webkit|khtml|opera|msie)[\/: ]([\d.]+)/ ) || [0,'0'])[1]; var isIE6a = (/msie/.test(ua) && !/opera/.test(ua) && parseInt(bver) < 7 && (!window.XMLHttpRequest || typeof(XMLHttpRequest) === 'function')); if (isIE6a) document.write('IE6'); // (2) var isIE6b = document.uniqueID && document.compatMode && !window.XMLHttpRequest && document.execCommand; if (!!isIE6b) document.write('IE6'); // (3) var isIE6c = /msie|MSIE 6/.test(navigator.userAgent); if (isIE6c) document.write('IE6'); /* IE7だけの判定方法 */ var isIE7 = window.XMLHttpRequest && (/*@cc_on!@*/false) && !(document.documentMode >=8); if (!!isIE7) document.write('IE7'); </script>

  • div要素を滑らかに動かしたい

    <div id="div1" class="div1" onclick="init();">move box</div> 上記のようなdiv要素を、画面右方向へ滑らかに 動かしたいのですが、どのようなscriptを記述すればよいでしょうか? setIntervalを使って0.5秒毎に1ピクセル右に移動、 というのを期待して以下のようなscriptを書いてみたのですが、 うまく動作しませんでした。 function init(){ setInterval(moveY, 500); } function moveY(){ var obj = document.getElementById("div1"); obj.style.left = obj.style.left+1 + "px"; }

  • innerHTMLに代入したインラインフレームのDIVの値の取得について

    下記のソースは「読み込み」ボタンを押した時にあらかじめ用意してた<div id="box">にインラインフレームを代入し、「値取得」ボタンを押したら、'sample.html'内のdivの値「keisan」をアラートで表示する記述です。このソース内容を、ボタンのイベントで「keisan」の値を取得するのではなく、<body>のonLoadでページを開いた瞬間にアラートが 出るようにしたいのですが、お分かりになる方はいらっしゃいますでしょうか? わかりにくい説明ですみません。どうかよろしくお願いします。 <html> <head></head> <body> <div id="box"></div> <input type="button" value="読み込み" onClick="Details.changeURL('sample.html')" /> <input type="button" value="値取得" onClick="Details.showMessage('keisan')" /> </body> <script type="text/javascript"> <!-- var Details = (function(){ var handle = document.getElementById('box'); var buffer = null; return { changeURL: function(url){ handle.innerHTML = "<iframe src=\""+url+"\" id=\"ifr\"></iframe>"; }, showMessage: function(id){ buffer = document.getElementById('ifr').contentWindow.document; alert(buffer.getElementById(id).innerHTML); } } })(); //--> </script> </html>