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

javascript

[javascript]スペルミスもないのに ○○ is not a function

どもです。
今回の話は件名の通り。

buttonにonClickを登録し、JS側にはその名称の関数を間違いなく設置。
したはずが、○○ is ... 全文を読む »

[JQuery]指定の列数を超過したら末尾「…」で後略する表示

どもです。
一覧を表示するとき、長い文章は冒頭だけ出力し、後ろを省略したい事例はままあります。

単純に表示制限をかけたい場合、縦横幅を明記した上で orverflow:hidden してしまえば楽勝です。... 全文を読む »

セレクトボックスをreadonlyにする。

どもです。

selectにreadonly属性をつけても、プルダウンの選択・変更はできてしまいます。
変更できてしまうのではreadonlyじゃないじゃないか。

$("select[readonly]").each(function(){
	$(this).find('option:not(:selected)').prop('disabled', 
... 全文を読む »

入力・選択した内容を同一フォーム内の別inputに転写する。

どもです。
とてもシンプルな話なのですが、地味な汎用性に感動を覚えたので備忘的メモ。

onblur = "this.form.転写先inputのname.value 
... 全文を読む »

jsのalert()に一律で音を追加する。

どもです。
次に必要になったときに忘れてそうなので、備忘しておきます。

参考:
[Qiita]既存の関数の呼び出しをフックする方法
[Syncer]クリックすると音が鳴るボタンの作り方... 全文を読む »

jsで「入力値がある場合」をチェックするならnullくらいは考慮しよう

どもです。

例えばセレクタを書き間違えるなどで指定の要素が存在しなかった場合、undefinedが返されます。

プルダウンの選択状態が解除されてしまった場合、valはnullになります。

そんな感じでjsで「入力値がある場合」をチェックしようとすると、undefinedやnullが来る可能性を考慮しなければなりません。
いやundefinedは正しく動いているなら来ない可能性が高いですが、nullくらいは考慮しておきましょう。... 全文を読む »

jsの連想配列をソートしたかった話。

どもです。

jsで連想配列(オブジェクト)の値によるソートを行いたかったのですが、調べても調べても

let array = 
... 全文を読む »

maxlength属性みたいにinputでバイト数制限する

どもです。

inputやtextareaでmaxlength属性を設定すれば、最大字数を設定できます。
これを超える入力やペーストは超過分だけカットされるので、非常に使い勝手が良いです。

しかし、バックヤード系だと結構要求されるのが、「字数」でなく「バイト数」の入力制限です。

一度は全部自力で作ってみたのですが、どうにも動作がもっさりしてしまったので、先人の知恵に頼ることにしました。... 全文を読む »

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

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

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


for(let array 
... 全文を読む »

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

どもです。

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

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

で、肝心の何がエラーを起こしていたのか、ですが。... 全文を読む »

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

どもです。

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

再現条件を調査したところ、
①alertでOKを押した直後、またはalertのフォーカスを外した直後
②Enterに相当するキー(CR)が入力されると... 全文を読む »

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

どもです。

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

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

と思っていたら、思わぬところにヒントを発見。... 全文を読む »

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

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

ForbiddenYou don't have
... 全文を読む »

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

どもです。

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

と思ったのですが、スマホ用ブラウザやアプリが使い勝手良く進化しているので、4年前の記事... 全文を読む »

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

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

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

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

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

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

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

message
... 全文を読む »

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

どもです。

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

$.map(array
... 全文を読む »

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

どもです。

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

動的に増やしたhtml要素を操作するjQueryに関するメモ書き

どもです。

jsで動的に増やしたhtml要素を操作するjQueryに関して、今更感漂うメモ書き。
何かあったら都度増えます。たぶん。

.click()は効かない。.on()を使う。

追加された要素は、.click()、.change()などの古いトリガーの書き方ではトリガーにならない。... 全文を読む »

ステップ操作のトリガー扱いにブラウザ差異があるのでinput[type=number]を使う際は注意。

どもです。
最近フォーム回りとSQLの話しかしてない気がする。

input[type=number]のフォーム操作について。

入力の数値に変更があった場合は再計算、という簡単なソースを作成したのですが、
Chromeでは正常に動いたのにFireFoxでは上手くいかず。... 全文を読む »