IE系でinputイベントが発火しないのをなんとかしてみる（ついでにIME入力中は発火しないイベントも追加） - Qiita
最初のコードはinputやtextareaでの値の変更時にIME入力中でなければ独自のイベントを発火するというものでしたが、IE系では「contenteditable="true"」を設定したエレメントでinputイベントが発火しないという他のブラウザとの差異がありましたので全面的に書き直しました。 最初のコードも旧コードとして残しておきます。 はじめに 以前jQueryでIME入力確定時にイベントを発行するという記事を投稿しましたが、inputやtextarea inputやtextarea、「contenteditable="true"」を設定したエレメントでの値の変更を監視するという面では不十分だった為、新たに書き直したものを公開します。 なお、2016年1月13日以降はWindowsVistaはIE9、その他はIE11のサポートのみとなる為、今回作成したものはIE9以降のサポートと
IE8で「オブジェクトでサポートされていないプロパティまたはメソッドです」と表示される
ひねりも何もない代入だけの行でエラーが発生している。 調べてみるとタグのIDと変数名がぶつかっていると発生するエラーということが判明。 なので変数名を変更して解決。 必要ないところでグローバル領域を使用しているのもどうかと思うがIEがID名で変数を作ってしまうのはとても厄介。 はまらないように気を付けよう。 ※ネットで突込みを見つけたので追記 2012/06/06 http://b.hatena.ne.jp/entry/www.crossl.net/blogwww.crossl.net/blog/ie8_err_nothing_prop_method/ referer見てたら見馴れないリンク元があったので見てみたら記事に対する突込みがあった。 ※引用 違うと思う。var で変数宣言しろってのが本筋だと思う。まあID属性値がそのままグローバルオブジェクトのプロパティになるのもどうかと思うけど
JavaScript の addRule と insertRule をまとめる | 衣谷止の開発日誌
2011/10/13 : IE8だと動かないミスがあったので一部修正（addRule の引数部分） IE とそれ以外のブラウザで一々処理を分けるのも面倒くさいし、CSSがある場合ない場合の処理を分けるのも面倒なので以下の様にすると楽ちん……かも。 head がない場合はもう知らん。 // スタイルシート挿入用共通メソッド addCSS var style = document.createElement('style'); style.setAttribute('type', 'text/css'); document.getElementsByTagName('head')[0].appendChild(style); var sheet = document.styleSheets[0]; if (sheet.insertRule) { sheet.addCSS = function
JavaScript で動的に追加したタグにスタイルシートが適用されない
Ajax プログラミングなどで、JavaScript を利用して後から動的にタグを追加したり変更したりした場合に、そのタグに設定したクラス名に対応するスタイルシートが適用されない場合がありました。 Safari や Google Chrome では CSS が正しく適用されているのに、Internet Explorer (IE8) でだけ、スタイルシートで指定した書式が適用されていない感じです。 調べてみるとその原因は、タグに対するクラス名の指定を "targetNode.setAttribute('class', クラス名)" で行っていることが間違いだったようでした。 この方法でクラス名を設定したタグを appendChild で追加しても、Internet Explorer に限っては、クラス名が設定されてないタグが追加されたものとされてしまう様子です。 ちなみに getAttrib
IE 6, IE7, IE 8 でキャッシュしておいた文字列を、動的に生成した script 要素に設定し、文字列を JavaScript として評価する方法 - latest log
IE 8 で文字列から動的に script 要素を生成したい時もあると思います。 オフラインにキャッシュしておいた文字列を JavaScript として評価したい場合などです。 こうすると動作します IE6 ～ IE8 専用です。 var script = document.createElement("script"); document.getElementsByTagName("head")[0]).appendChild(script); script.outerHTML = ' <script defer="defer">' + jsExpression + '</script>'; document.createElement("script") でダミーの(プレースホルダの) script 要素を作り、そのあとで outerHTML で上書きしています。 これでも良
IE8 で擬似要素のスタイルの動的な更新ができない
JavaScript で要素のクラス属性を操作してスタイルを変更するような場合、IE8 には :before/:after 擬似要素のスタイルが再描画されないというバグがある。 <p> <a href="#" class="selected">One</a> <a href="#">Two</a> <a href="#">Three</a> <a href="#">Four</a> </p> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script> $('p').each(function () { var $links = $(this).find('a'), i = $links.filter('.selected').eq(0).index(), len =
【JavaScript】IE9以前でconsole.logを使用しているとハマる - Qiita
##はじめに FirefoxとかChromeなら問題ないがIEだと上手く動作しないとかはよくある話だと思う。その要因の一つであるconsole.log使用時のエラーに、つい最近ハマったのでメモしておく。 ##対処法 そもそもなぜconsole.log使用時にエラーが出るのかといえば、IEがConsoleAPIに対応していないために、window.consoleの時点でundefinedを吐くからである。対処法としては、 // consoleプロパティとlog関数作ってとりあえずエラー回避 if(!window.console) { window.console = { log: function(msg){} }; }
IE7以前のブラウザでJSONを配列に分離する
Ajaxを使ったサイトでは、取得したデータを受け取るときにはJSON形式にして送信元に結果を返すことが多いと思います。 IE8以降や一般的なモダンブラウザならこれといった問題は生じないのですが。 このJSON形式を配列に分離する際に、IE7以前で分離できない問題にハマってしまいました。 問い合わせたJSONを配列にパースする var obj = JSON.parse(responceText); Ajaxで問い合わせて返却されたデータが、JSON形式にエンコードした状態でresponceText変数に格納されていると仮定します。 この記述は、IE8以上のIE、一般的なモダンブラウザ（Chrome/Firefox/Safari）で問題なくデータを配列に分離できました。 ところが、この記述はIE7以前ではJavascriptエラーとなってしまいます。 エラーコンソールによると、JSONに関する
JSONとJSONPのContent-typeに書くMIMEタイプ - kanonji’s diary
ファイル 正しいMIMEタイプ RFC IE用 json application/json http://www.ietf.org/rfc/rfc4627.txt RFC通り jsonp application/javascript http://www.ietf.org/rfc/rfc4329.txt text/javascript JSONの場合はapplication/jsonだけど、JSONPって実体はコールバック関数でJSONを包んだ単なるJavaScriptなので、MIMEタイプはJavaScriptと同じです。JavaScriptのMIMEタイプは、以前はtext/javascriptだったけど、2006年4月にRFC4329が出てapplication/javascriptになったんだとか。 IEって使えない Internet Explorer 7 では applicati
これは凶悪……コーディングのヤバいバグ＆仕様 Best5 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいとです。 コーディング中にバグやブラウザ仕様のせいで、「なんじゃこりゃアア」ってなること、皆さんありませんでしょうか。 今回は、その中でもとりわけ「なんじゃこりゃアア具合」が激しいトラブルを、僕の独断と偏見のランキング形式でお話しさせていただきます。 なんでランキング形式にしたかというと、そっちの方が面白いと思ったからです。面白くなかったらごめんなさい。 第5位 IE9.jsを入れると、IE7で謎の隙間が発生しまくる IE9.jsを採用したサイトをIE7,8で見ると、 <class="ie7_anon ie7_class6" id="ie7_pseudo2" style="overflow: hidden; display: block;"/> こんなものが追記されていたりします。 こいつに高さがあるせいで、隙間が生まれてしまいます。が、こいつがな
機密情報を含むJSONには X-Content-Type-Options: nosniff をつけるべき - 葉っぱ日記
WebアプリケーションにおいてJSONを用いてブラウザ - サーバ間でデータのやり取りを行うことはもはや普通のことですが、このときJSON内に第三者に漏れては困る機密情報が含まれる場合は、必ず X-Content-Type-Options: nosniff レスポンスヘッダをつけるようにしましょう(むしろ機密情報かどうかに関わらず、全てのコンテンツにつけるほうがよい。関連:X-Content-Type-Options: nosniff つかわないやつは死ねばいいのに! - 葉っぱ日記)。 例えば、機密情報を含む以下のようなJSON配列を返すリソース(http://example.jp/target.json)があったとします。 [ "secret", "data", "is", "here" ] 攻撃者は罠ページを作成し、以下のようにJSON配列をvbscriptとして読み込みます。もちろ
HTML5で組んでるならこの魔法のjsも入れておけっていう話
現在、A!@attripさん発で話題になっている「たった2行でIE5.5～IE8をモダンブラウザの挙動にする魔法のJS」という記事。 Webデザイン界隈では当たり前のものですが、実はもうひとつ追加しておくといいかもしれないjsがあったりします。 Photo:html5 By michael pollak IE8以前のブラウザはどうにもこうにも開発者泣かせなわけですが、ie9.jsとcss3-mediaqueries.jsを突っ込むことで、モダンブラウザと同じ挙動にすることができちゃいます。 もう少し具体的に書くと、ie9.jsを組み込むことで、 position:fixed;に対応 max-width、max-heightに対応 属性セレクタ、擬似クラスに対応 margin:0 auto;でのセンタリングに対応 透過PNGに対応 opacityに対応 といったことが可能になります。要はCS
IE7以下でもdisabled 属性を利用できるようになる「select-option-disabled-emulation.js」
IE7以下でもdisabled 属性を利用できるようになる「select-option-disabled-emulation.js」 JavaScript Library Archive IE7以下でもdisabled 属性を利用できるようになる「select-option-disabled-emulation.js」 Check Tweet 配布元：Select, Option, Disabled And The JavaScript Solution ライセンス：非商用に限り無料 select-option-disabled-emulation.jsはIE7以下でもoption要素のdisabled 属性を利用できるようになるJavaScriptライブラリです。 通常、option要素にdisabled属性を記述した場合、文字の色が薄くなり選択できなくなります。 <select> <o
[JS]IE6/7/8でアクセスしたユーザーに新しいブラウザのインストールを促すスクリプト -IE Alert js
ユーザーがIE6/7/8でアクセスした際、IE9へのバージョンアップや他のモダンブラウザのインストールを促すjQueryのプラグインを紹介します。 IE Alert js [ad#ad-2] IE Alert jsのデモ IE Alert jsの使い方 IE Alert jsのデモ デモはIE6/7/8でご覧ください。 IE9、Firefox, Chrome, Safari, Operaでは、下記のように通常通りに表示されるだけです。 デモページ：IE7で表示 [ad#ad-2] IE Alert jsの使い方 使い方は簡単で、2ステップです。 Step 1: 外部ファイル 「jquery.js」と当スクリプト・スタイルシートを外部ファイルとして記述します。 iealertフォルダ内にスタイルシート、および必要な画像が入っています。 <link rel="stylesheet" type=
FireFoxでjavascriptのlocation.hrefが機能しない « kawama.jp
<input type="button" value="ボタン" onClick="location.href('http://www.yahoo.co.jp')"> このボタンが、IEでは動作するけどFirefoxでは動作しなかった。 で、 <input type="button" value="ボタン" onClick="location.href='http://www.yahoo.co.jp'"> という具合にしてみたら、動いた。 以下で実際に試せます。 <input type="button" value="ボタン" onClick="location.href(‘http://www.yahoo.co.jp’)"> <input type="button" value="ボタン" onClick="location.href=’http://www.yahoo.co.jp’">
IEでも動作するJavaScriptプロファイラ、XBug を試してみた - hagino3000's blog
IE6/7 でも動作するというJavaScriptデバッガ/プロファイラのXBugを試してみたのでメモ。 XBug - Information http://www.xbug.co.uk/xbug.htm サイトが非常に見にくいのはひとまず置いておいて、特徴はサーバ側にファイルを配置して使う所がFirebug等のプロファイラと異なる点でしょうか。とりあえずローカルサーバで使う場合のやり方。 画像は例としてFCKeditor起動時のパフォーマンスを計測してます。 ファイルの配置 ダウンロードページからインストーラーをダウンロードして起動。インストール先を聞かれるので、ローカルApacheのDocument Rootを指定。htmlファイルやjsファイルが配置される。 起動 インストールしたディレクトリにxbug.htmが存在するので http://localhost/xbug.htm からア
IE 6, IE 7, IE 8 が退場した未来 - latest log
Internet Explorer の自動アップグレードについて | TechNet 長かった… 本当に長かった… やっと、IE 6, IE 7 が居なくなるのですね… uupaa.js ver 0.8 に埋まっている処理から情報を抜き出し IE 6, IE 7, IE 8 が居なくなった未来では何が可能になるのか抜粋してみました。 IE8 でやっと使えるようになる機能 一部は IE 6 や IE 7 でも使えるのですが、対応が限定的だったり不具合が多かったりと、安心して使えなかった機能も含まれています。 display: inline-block display: table, table-cell など position: fixed; E:active {...} E:focus {...} E::first-child {...} E:lang(C) {...} E::after
Masato Kinugawa Security Blog: Googleのmetaリダイレクトに存在した問題
Googleに存在したメールアドレスを窃取できた問題について書きます。これは2011年1月30日に報告し、報告後数日以内に修正された問題です。 こんなページがありました。 http://example.google.com/redirect?continue=http://example.google.com/xyz <meta http-equiv="refresh" content="0;url='http://example.google.com/xyz'"> <script> location.replace("http://example.google.com/xyz") </script> continueというパラメータに指定されたURLをmetaタグとlocation.replace()にそれぞれ入れて、JavaScriptの有効/無効の設定に関わらずリダイ
IEでのonBeforeUnload の挙動 | Inside ASCADE
Javascript で onBeforeunload を利用したときに IE の挙動が直感的な操作とは異なったため、調査をすることにしました。 何が直感的ではなかったかというと、<a> タグの href で javascipt を呼び出した場合に location を変化させない（つもり）にもかかわらず、onBeforeunload イベントが発生したことです。ちなみにFirefoxではこの場合にイベントは発生しません。 ちょっと調べたところ、MSDN に仕様があったので、挙動確認のサンプルを作成してみました。 各サンプルの実行はご覧のブラウザをIEに変更していただき 各sampleのTEST をクリックしてください。 MSDN onbeforeunload site : http://msdn.microsoft.com/en-us/library/ms536907.aspx
» jQueryでもはまるクロスブラウザ問題まとめ: エスキュービズム ラボ Blog
IEとfirefoxなどのブラウザ間でjavascriptの仕様が違うというクロスブラウザ問題。最近はjQueryなどのライブラリを用いることによって、その違いをライブラリが吸収し、開発が容易になっています。しかし、残念ながら、jQueryを使っても、結構、クロスブラウザ問題にはまってしまいます。以下、そのようなはまった点についてまとめみます。 １．連想配列の最後のカンマ。firefoxだと無視されますが、IEだとエラーになります(例)。分かっていても、ついやってしまいます。 ２．width/heightの解釈の違い。前回のブログにも詳細が書いてあります。jQueryのwidth()/height()でもその違いは吸収できません。前回のブログにあるように、DOCTYPEをきちんと指定するしかないようです。 ３．z-Indexの解釈の違い。firefoxではz-Indexが最優先なのに対し、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
