jQuery checkboxのチェックを変更する
2013年09月10日 11時14分
よく忘れるのでメモ。
jQueryが1.6以降はpropを使用する！
1回だけ動いて2回目から動かなかったりしたらこの辺りを疑う。
|
|
// 1.6以前 or (1.6.1 ～ 1.8) $checkbox.attr('checked', 'checked'); $checkbox.removeAttr('checked'); // 1.9以降 $checkbox.prop('checked', true); $checkbox.removeProp('checked'); // 値チェック $checkbox.prop('checked'); $checkbox.is(':checked'); |
参考サイト
-
jQUery .prop()
-
http://api.jquery.com/prop/
-
jQuery Core 1.9 Upgrade Guide – attr versus prop
-
http://jquery.com/upgrade-guide/1.9/#attr-versus-prop-
IEのみでJavaScriptエラー「標識子、文字列または数がありません。」
2012年01月31日 16時49分
IEだけで警告が出る箇所があって何かなぁ？と思っていたらカンマだった。
連想配列で最後にカンマがあると他のブラウザだとエラーを吐かずにIEだと吐くらしい。
|
|
var hoge = { a : "b", // ←ここの「,」 }; |
これはIEの動きが正しいな。
２、３カ月前に自分が治したらしいのだが全く記憶にないのでメモメモ…
JavaScriptで子要素追加をIE6でも動くようにするには
2011年10月25日 16時28分
jQueryでappendやprependを使って要素を使っていたらIE6で思ったように動かなかった。
検索してみると似たような人を見つけた。
http://d.hatena.ne.jp/nitoyon/20090219/object_jquery
上の指摘通りにjQueryをあきらめてdocument.createElementで作成したらうまくいった。
以下のような感じ。
|
|
var img_next = document.createElement("img"); img_next.src = "./img/next_btn.png"; img_next.className = "class_img"; var main = document.getElementById("main"); main.insertBefore(img_next, main.firstChild); |
IE8で「オブジェクトでサポートされていないプロパティまたはメソッドです」と表示される
2011年10月17日 17時44分
仕事中、既存システムで変な症状が報告された。
|
|
a = b; //←「オブジェクトでサポートされていないプロパティまたはメソッドです」 |
ひねりも何もない代入だけの行でエラーが発生している。
調べてみるとタグの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属性値がそのままグローバルオブジェクトのプロパティになるのもどうかと思うけど。
ということで書き殴り全開のこの記事にまさかの突込みをいただいたので掘り下げてみた。
Case.1
|
|
<html> <head>～</head> <body> <span id="a">hoge</span> <script type="text/javascript"> a = 1; // エラー </script> </body> </html> |
Case.2
|
|
<html> <head>～</head> <body> <span id="a">hoge</span> <script type="text/javascript"> var a; a = 1; // エラーなし </script> </body> </html> </script> |
Case.3
|
|
<html> <head>～</head> <body> <span id="a">hoge</span> <script type="text/javascript"> b = 1; // エラーなし </script> </body> </html> |
勿論確認はIE8。
指摘にあった通り、タグIDと同じ名前で変数宣言するとエラーは発生しなかった。
しかしこの記事で言いたかったことはその事ではない。
Case.1とCase.3の変数名による違いである。
Case.1の場合、ウォッチで変数aを見てみるとDispHTMLSpanElementというオブジェクトになっている。
そこへの代入でエラーが発生する。
Case.2の場合、代入前の変数aはundefinedになり代入が可能となる。
var宣言は変数の巻上げが起こるのでどこでされようと最初に変数は定義される。
Case.3のタグIDと変数名が違う場合、JavaScirptは明示的にvarで宣言しなかった場合グローバルオブジェクトのプロパティとして扱われエラーとはならない。
この記事を書いたときには勘違いしていたがCase.1をFirefoxで動かしてみたら代入でエラーが出ないだけで変数aはオブジェクトとして存在していた。
よくよく考えてみればwindow[‘タグID’]見たいなアクセスが出来るのはグローバルオブジェクトのプロパティとして存在しているからだからタグIDの変数が出来るのは当然か。
IEだけ代入時に問答無用でエラーが発生するから誤解してしまった。
しかし指摘通りにvarでタグIDと同じ変数を宣言してしまうと示す変数が変わってしまい以下のような記述が出来なくなってしまうので注意が必要。
|
|
<html> <head>～</head> <body> <span id="a">hoge</span> <script type="text/javascript"> // var a; を宣言しているとwindow['a']がタグオブジェクトでなく変数undefinedになりエラーとなる。 alert(window['a'].outerHTML); // <span id="a">hoge</span> </script> |
やはりタグIDとJavaScirptの変数名は分けることが懸命という結論。
JSON形式のチェック方法
2011年09月10日 00時16分
JSON形式でデータを返却するWeb APIでデータを確認するのに既にある素晴しいツールを使わない手はないということで以下を使用。
JSON View（ブラウザ アドオン）
FireFox https://addons.mozilla.org/ja/firefox/addon/10869/
Chrome https://chrome.google.com/extensions/detail/chklaanhfefbnpoihckbnefhakgolnmc
デバッグなどで直接値を変更したい場合は以下を使用。
JSONLint The JSON Validator
http://jsonlint.com/
インデントなど整形もしてくれて形式にエラーがある場合はエラー行も表示してくれる。
素晴しいサービスに感謝。
