<div id="q1-1">
<p>■色を選んで下さい</p>
<select name="code157">
<option value="">▼お選びください</option>
<option value="1">レッド</option>
<option value="2">ブラック</option>
</select>
</div>

]

JS[

$('#q1-1 select).val("");

]

上記のように書いても、

jquery Mobile上は変わらない。

そこで、

HTML[

]

JS[

$('#q1-1 select).val("");

$('#q1-1 .ui-btn-text').text("▼お選びください");

]

面倒だけども、jquery Mobile時に挿入されるspan.ui-btn-textの値に、

直接リセット時の値を入れてやることで解決した。

次。

一部抜粋ではあるけど、

ラジオボタンやチェックボックスの値がリセットした時に反映されない問題もあった。

これは以下のように解決した。

JS[

//jQuery Mobileはスマホの時だけ実装されるので、スマホだけで実行される命令を

//if文で記述。これが無いと、それが実装されていない時にエラーとなって、止まっちゃう。

if ( (_UA.indexOf('iPhone') > -1 || _UA.indexOf('iPod') > -1) && (document.cookie.indexOf('jet_viewmode=PC') == -1) ) {

$(values).prop("checked", false).checkboxradio("refresh");
}else if (_UA.indexOf('Android') > -1 && document.cookie.indexOf('jet_viewmode=PC') == -1) {
$(values).prop("checked", false).checkboxradio("refresh");
}

//ここから下は値をリセットする共通の命令。

$(values).attr('checked', false);

]

これでjquery Mobileに対応しましたよっと。

2014-05-27

ドキュメントモードとIEと互換モード

IE9だけバグが出るって言われたようで、

どうしたらいいか考えたら、互換モード変えちゃえって話になった。

ドキュメントモードをいじってみたらどうだろう？

てことで、以下のサイトを参考にした。

X-UA-Compatibleの指定でIE11をIE10で表示させる｜Web制作 W3G

<metahttp-equiv="X-UA-Compatible"content="IE=5; IE=8">

これを引用して、以下のようにした。

<metahttp-equiv="X-UA-Compatible"content="IE=7; IE=8; IE=10; IE=11">

コレでうまくいくのかな？

そして、ドキュメントモードは何かを判断するために、jsを書けるか調べた。

IE8 の描画モードを簡単判定 (Tips) by Bin-Cook

このページを参考に、以下のソースを書いてドキュメントモードを参照した。

alert(document.documentMode);

参照までは出来たみたいだけど、、、

追伸：

META タグと将来の互換性のロック

特集：Web制作者＆開発者のためのIE9概説（前編）：Internet Explorer 9正式版レビュー (1/3) - ＠IT

2014-02-15

xampp設定でぶつかったこと。

改めて、xamppを入れようと思った。

元々はzipからフォルダを展開して利用していたのだが、

ずっとフォルダをコピーして使っていたために、

index.phpがどっかいったり、不足したファイルもあったので、

改めてインストールすることにした。

(SDカードのEドライブ上だったし。)

久々にxamppのページ見たら、

bitnamiっていう冠のついた名前になってるし。

パットナムみたいな名前だな。日ハムの。

そんでインストールしたんだが、

日本語で利用してぶつかった問題があった。

それはセキュリティページのナビとメインが文字化けすること。

これ、こちらのページ(http://fu-tara.com/wordpress000230/)で対応したのだけども、

どうもchromeでうまくいかない。

文字コードをutf-8で保存しているのに。

理由を探っていたら、

メモ帳を使っていたのがまずいらしい。

秀丸で保存したら、うまくいって、なんだかなって思った。

2014-01-22

iOSでselectedが外れない件

覚書程度に。

必要があって、htmlのselect内で特定のoptionを選んだときに、

アラートを出して、選んだoptionをリセットさせるjavascript(jquery)を書いた。

jQuery(function(){

jQuery('#foo1').change(function(){

var fo1 = jQuery('#foo1 option:selected').val();

var fo2 = jQuery('#foo2 option:selected').val();

var fo3 = jQuery('#foo3 option:selected').val();

if(!fo1 ==""){

if(fo1 == fo2){

jQuery('#foo1 option:selected').attr("selected",false);

alert(fo2);

}else if(fo1 == fo3){

jQuery('#foo1 option:selected').attr("selected",false);

alert("選択肢がかぶっています");

}

});

jQuery('#foo2').change(function(){

var fo1 = jQuery('#foo1 option:selected').val();

var fo2 = jQuery('#foo2 option:selected').val();

var fo3 = jQuery('#foo3 option:selected').val();

if(!fo2 ==""){

if(fo1 == fo2){

jQuery('#foo2 option:selected').attr("selected",false);

alert("選択肢がかぶっています");

}else if(fo2 == fo3){

jQuery('#foo2 option:selected').attr("selected",false);

alert("選択肢がかぶっています");

}

});

jQuery('#foo3').change(function(){

var fo1 = jQuery('#foo1 option:selected').val();

var fo2 = jQuery('#foo2 option:selected').val();

var fo3 = jQuery('#foo3 option:selected').val();

if(!fo3 ==""){

if(fo3 == fo2){

jQuery('#foo3 option:selected').attr("selected",false);

alert("選択肢がかぶっています");

}else if(fo1 == fo3){

jQuery('#foo3 option:selected').attr("selected",false);

alert("選択肢がかぶっています");

}

});

</script>

<option value="">▼お選びください</option>

<option value="a">ぽれぽれぽれ</option>

<option value="b">うかれぽんち</option>

<option value="c">みやわやさん</option>

</select>

<option value="">▼お選びください</option>

<option value="a">ぽれぽれぽれ</option>

<option value="b">うかれぽんち</option>

<option value="c">みやわやさん</option>

</select>

<option value="">▼お選びください</option>

<option value="a">ぽれぽれぽれ</option>

<option value="b">うかれぽんち</option>

<option value="c">みやわやさん</option>

</select>

これ、iOS以外はうまく動く。

でも、iOSだと動かない。blurもだめだったし、

$("#foo3 option")val("")としてもだめだった。

で、こうしたらうまくいった。

jQuery('#foo2 option.pon').attr("selected",true);

=>jQuery('#foo2 option:selected').attr("selected",false);

<option class="pon" value="">▼お選びください</option>

=><option value="">▼お選びください</option>

よかったよかった。