上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
コミュニティ検索 »
prototype.js使えば楽勝、とか思っていたら意外とハマったのでメモ。

iTunesみたいなselectが3つ並んで左から選択するUIを作りたいと。
で、FirefoxやSafariだと

<option value="0">ロック</option>
<option value="1">ダンス</option>
・・・
みたいにoptionタグだけか、

<select id="hoge">
  <option value="0">ロック</option>
  <option value="1">ダンス</option>
</select>
みたいにselectタグをサーバで返して、
selectタグ自体を直接Ajax.Updaterで書き換え可能でした。
$('hoge').innerHTML = request.responseText;
でイケたと。


でもIEだとダメで、同じことにハマってる人も何人かいたみたい。
http://snowland.net/nucleus/item/742


MSのサイトには3つ回避策が書いてあったけど、
結局divでselectを囲んでdivごと書き換えてみました。
サーバでは上記のようなselectを返しておいて、

var isMSIE = /*@cc_on!@*/false;

if (isMSIE) {
    $('hoge').outerHTML = '<div id="hoge">' + request.responseText + '</div>';
} else {
    $('hoge').innerHTML = request.responseText;
}

として、IEだったらouterHTMLにdivを付け足して書き込み。
1行目はこれだけでIEかどうか判定するためのコード。

最初は囲んだdivを書き換えるだけでイケる、
と思ってたらダメだったので、IE判定&outerHTMLへの書き込みをしてます。
やり方がまずかっただけかも。もしくは寝ぼけてたか。
ま、とりあえず動いたのでこれで。
スポンサーサイト
コメント (0) | トラックバック (0)
コミュニティ検索 »
トラックバック
この記事のトラックバックURL
http://completemirage.blog55.fc2.com/tb.php/45-70dc3638
この記事にトラックバックする(FC2ブログユーザー)
コメント







非公開コメント
プロフィール
 

miyazima

Author:miyazima
常に変化を好み、面白いことを探しています。次の次は?

カレンダー
 
03 | 2017/03 | 04
- - - 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31 -
カウンター
 
天気予報
 

-天気予報コム- -FC2-
ブログ内検索
 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。