ど素人から毛を生やす。<延>

javascript

IEはfor..ofループ使えないし、IE8はarray.indexOfすら使えない

Web > javascript 2019年7月23日(最終更新:25日前)

どもです。
タイトル10割の備忘録。

モダンブラウザで動かすなら、これだけの処理。

まず、IE11すらfor..ofは使えないので、こうなります。

しかしIE10以下はletが使えないので、こうなります。

随分とダサくなりましたが、まあ仕方ないでしょう。
と思いきや、配列.indexOf()がIE8で使えないそうです。

いや今どきIE8て。
旧いシステムで対応ブラウザが指定されているような例を除いて、IE8とかもはや情弱ツールでしょ…

対応しなきゃダメ?なんでさ。

この辺から溜息が憤りに変わってきます。

読み辛ッ…読み辛い!!


参考サイト
[Qiita]ES2015(ES6) 入門... 続きを読む »

scriptタグの中のURLはHTMLエスケープしちゃダメ…のはずが。

Web > javascript 2019年6月19日(最終更新:1月前)

どもです。

とある旧いWebシステムのアップデートを行いました。
どれくらい旧いかといえば、推奨環境がIE5~8という旧さです。

で、アップデートの直後、窓口の方から「ボタンを押したらエラーになった!」と報告があったのですが、詳しく状況を伺うと推奨環境のIEでなくGoogleChromeでアクセスしていること、そもそも今回アップデートした箇所とは無関係であることがわかりました。ヲイ。

で、肝心の何がエラーを起こしていたのか、ですが。

window.open("xxx.php?para1=1&pra2=2");

これでした。

正確には、これをjsファイルの中で書いたことでした。

確かにURLの「&」を「&」で書くことは推奨されていますが、これはあくまでhtml中の場合です。

jsファイルは当然、srciptタグの中もjsのルールで動きます。
そして... 続きを読む »

$(document).keypress(function(){})はスマホの個体差で爆死することを僕は学んだ。

Web > javascript 2019年5月23日(最終更新:2月前)

どもです。

バーコードリーダをBluetoothでスマホに接続するタイプのウェブシステムを作っていたのですが、いざ実機(AndroidのGoogleChrome)で動かしてみると稀にホーム画面に飛んでしまう。なにゆえ?

再現条件を調査したところ、
①alertでOKを押した直後、またはalertのフォーカスを外した直後
②Enterに相当するキー(CR)が入力されると
③ブラウザのツールバーの先頭(最左)が実行される

らしい。
アプリのChromeでは先頭がホームへのリンクのため、ホームに飛んでしまったわけです。
ホームへのリンクを非表示にしたところ、今度はURL欄の「サイト情報を表示」がヒットしました。

しかもこの現象、同じサイト上でも起きるページと起きないページがあるのです。
どうやらアラートウィンドウのOKボタンに初めからフォーカスが当たっている場合と無い場合があり、当たっている場合がアウトのよう。この差はなんだ。

$(document).keypress(function(){})で着火しているとアウトッッッ!!!

以前、iPhoneで検証したページをマイナーな実機で起動したら、$(document).keypress(function(){})が着火しなかった事件、あったなぁ…。(遠い目)

今回は.keypressで着火はOK、その後の処理も概ね問題なく、アラート時のフォーカスだけがバグった、と。... 続きを読む »

XMLなのにresponseXMLがnullでresponseTextに値が入るときに確認すること

Web > javascript 2019年5月17日(最終更新:2月前)

どもです。

XMLをjsで読み込む簡単なプログラムを作っていたはずなのですが、何故か読み取ったファイルのresponseXMLがnullになる。
responseTextには読み込んだファイルの中身が入っているので、読込後のエラーのはずです。

overrideMimeType()など試してみましたが、どうにもダメ。テキストでしか読めない。何故だ…

と思っていたら、思わぬところにヒントを発見。

XMLデータは階層構造になっています。HTMLと比較しても曖昧な構造にはなっていません。HTMLでは適当にタグを記述してもブラウザがうまく処理してくれましたが、XMLの場合には適当にやってしまうと正しく処理されません。
OpenSpace サーバー上のXMLファイルを読み込む

もしかして…と思い、件のXMLをGoogleChromeで開いてみることにしました。

XMLエラー

こここ、これだぁああああ!!

件のXMLが元はHTMLファイルだったことで、HTMLタグが残ってしまっていたんですねえ!!!

で、少しでもエラーがあると、XMLはXMLとして機能してくれなくなるんですねえ!!!!

それによりXMLとは認識されなくなって、responseXMLに入ってくれなかったんですねえ!!!!!

はぁ。しょーもな。_(:3」∠)_

この記事は役に立ちましたか?
... 続きを読む »

Ajaxで403エラーを食らった原因がファイル拡張子だった話。

Web > javascript 2019年3月25日(最終更新:4月前)

どもです。
AjaxでデータをPHP処理しようとしたところ、403エラーになりました。

ForbiddenYou don't have permission to access /***/****/ajax.inc
on this server.

普段からAjaxを普通にやっているサーバーなので、パーミッションエラーというのは考えにくいのだけれど。

とか思っていたら、ファイルの拡張子が原因でした。

ajax.inc ... 続きを読む »

jQueryのイベント発火順を理解して、簡単に「それ以外を押したら閉じるサイトメニュー」を実装する。

Web > javascript 2019年3月20日(最終更新:4月前)

どもです。

HTML&CSSコーダーから離れて久しい僕ですが、久しぶりにまともにスマホ用ページを作ることに。
というわけでタッチで開閉するメニューを…

と思ったのですが、スマホ用ブラウザやアプリが使い勝手良く進化しているので、4年前の記事では不足。
具体的には「タッチで開閉するメニュー」に加え、「メニュー以外をクリックしたら閉じる」ようにしてやらないと、今どきは不親切です。

... 続きを読む »

inputに半角だけ入力させたい

Web > javascript 2018年10月10日(最終更新:8月前)

どもです。
フォーム回りは本当にブラウザ差異が活発極まりなく。

さて、まずはこの要望についてですが、
ブラウザ側での制御はいくらでも抜け道があるため、action側で全角⇒半角処理を行うのがBEST

という結論を前提に置いてから以下をご覧いただけると幸いです。

今回のテーマは、それでもブラウザ側で制御したい場合。
往々にしてそれはバックヤードなサイト的な、悪意を以てフォームを触る方が現れない閉鎖的なサイトであることでしょう。

そういったサイトの、作業の効率化やミスのリスクを減らすための入力制限を考察します。

HTML、CSSで制御する

IE、Edge、Firefox

一昔前、半角の入力制御といったらこれでした。ime-mode。
現在は公式に廃止される... 続きを読む »

text()で改行コードを含むテキストを取得、alert()とかconfirm()とかtextareaとかに出力したかった話。

Web > javascript 2018年8月3日(最終更新:1年前)

どもです。
jsのしょーもない話です。

PHPで改行コードを含むテキストをHTML上に出力、jsでそれを拾ってconfirm()に表示、ってやりたかった。

<p>このテキストを出力したい。\n改行もしたい。</p>

message = $("p").text();
alert(message);

「このテキストを出力したい。\n改行もしたい。」

なして改行コードのまま出力されてしまうんじゃぁああ(T_T)

この疑問を解決してくれたのが、こちらのYahoo!知恵袋の投稿

えーっと、つまるところ、... 続きを読む »

jsでforeachがやりたいとき、jQueryが使えるなら$.map()がそれっぽい?

Web > javascript 2018年5月2日(最終更新:3月前)

どもです。

jQeryの$.map()って、普段は$("input").map(function(){})みたいに
要素をループさせるのにばかり使っていたのですが、foreach的な使い方ができたんですね。

$.map(array, function(value, key){ })

こーすると。

しかもこのarrayのところ、オブジェクトでもOK。つまり連想配列OKです。やったぜ。

このとき、thisとvalueは同じものが入るので、セレクタとして使いたいときは$(this)でも$(value)でも可。... 続きを読む »

endsWith()って超イイ感じだけどIEの野郎が非対応なんだって!

Web > javascript 2018年4月20日(最終更新:1年前)

どもです。

jsで後方一致が使いたいがために、endsWith()を使いました。
そうしましたところ、

( ゚Д゚)「endsWith()はIEが対応してないから、作り直して!」

(*'ω'*)「今時IEなんて対応して誰が得するんだよォオオオオオオ!!!」

これだと[target].endsWith(str)⇒endsWith([target], str)になるのが痛いですが、仕方ない。

あと今回要らなかったのでパラメータにも対応してないです。つら。

なんとか最小限の変更で回避。IEつら…

この記事は役に立ちましたか?
  • _(:3」∠)_ 面白かった
... 続きを読む »