ようへい

2013年1月24日木曜日

jQuery 1.9に移行してハマったこと

jQuery 1.9へのアップグレードガイドはこちら (英語)
jQuery Core 1.9 Upgrade Guide | jQuery
http://stage.jquery.com/upgrade-guide/1.9/ そのうち(機械翻訳を駆使して)翻訳するかもしれません。

TypeError: $(...).live is not a function

jQuery 1.9では.live()が削除されている。同じように、.die()も削除されている。
.live()を、jQuery 1.9で使用しようとすると、以下のようなエラーが出力される。
TypeError: $(...).live is not a function
.live().on()に、.die().off()にそれぞれ置き換えられている。
以下のように書き直すことで、1.9へ移行する事ができる。
$('.live').live('click', liveFunction);
$('.live').die('click', liveFunction);
$(document).on('click', '.live', liveFunction);
$(document).off('click', '.live', liveFunction);

Error: Syntax error, unrecognized expression

$()にHTML文字列を渡して解析していたのだが、jQuery 1.9ではエラーになった。
jQuery 1.9からは、$()に渡す文字列の最初が<以外の場合はセレクタとしてみなされるようになったためだ。
HTML文字列が<で始まっていない場合、以下のようなエラーが出力される。
Error: Syntax error, unrecognized expression:
この場合、$.parseHTML()を用いることで解析することが出来る。
以下のように書き直すことで、1.9へ移行する事ができる。
var html_string_1="<div>hoge</div>",
html_string_2=" <div>HOGE<div>FUGA</div></div>";
console.dirxml($(html_string_1).get(0));
console.dirxml($(html_string_2).get(0));
var html_string_1="<div>hoge</div>",
html_string_2=" <div>HOGE<div>FUGA</div></div>";
console.dirxml($($.parseHTML(html_string_1)).get(0));
console.dirxml($($.parseHTML(html_string_2)).get(0));
あれ、思ったような結果にならない・・・
という事でこんな感じにしました。
var html_string_1="<div>hoge</div>",
html_string_2=" <div>HOGE<div>FUGA</div></div>";
console.dirxml($($.parseHTML(html_string_1)).get(0));
console.dirxml($($.parseHTML(html_string_2.trim())).get(0));
または
var html_string_1="<div>hoge</div>",
html_string_2=" <div>HOGE<div>FUGA</div></div>";
console.dirxml($($.parseHTML(html_string_1)).get(0));
console.dirxml($($.parseHTML(html_string_2.replace(/^[^<]+/,''))).get(0));
もうちょっと調べる必要があるな・・・
関連記事

0 件のコメント:

コメントを投稿