jquery mobileのトグルスイッチ・スライダーをjavascriptから切り替えたい時

前回のエントリはjquery mobileでプルダウンを選択状態にしたい時だが、同様にjavascriptを使ってデータを取得したり、フォルダや引数からデータを取得したものをトグル・スライダーの表示に反映させたいことも多いはず。
トグルボタン・トグルスイッチ・スライダーを、javascriptを使い取得した値に合わせて選択済にさせる方法は以下のサンプルを参考にすると良い。

html

<form>
<select name="slider" id="toggle" data-role="slider" onChange="navi(this)">
<option value="stop">停止中</option>
<option value="start">送信中</option>
</select>
</form>

javascript

<script type="text/javascript">
//選択済にしたい項目のvalue
var co = 2;
//トグルメニューをセットする
$('#toggle').val(co);
//jquery mobile用の処理
$('#toggle').slider('refresh');
</script>

最後の

$('#toggle').slider('refresh');

がポイント

 

デジタルゲートがお手伝い

ホームページをリニューアルしたい、スマホ対応にしたい、デザインそのままで機能だけ追加したい、更新だけ代行して欲しい。サイトを運営したいけど誰に相談したらいいか分からない。そんな時はお気軽にお問い合わせください。

スポンサーリンク