5つのフィールドでフッターを作成しようとしています。そのうちの1つは選択ボタンですが、なぜ2つの選択ボタンが表示されるのかわかりません!!
これは私のコードです:
<div class="ui-bar ui-grid-c" style="height:30px;width:100%;border-top:solid 2px black;">
<div class="ui-block-a" style="width:55%;">
<div class="ui-bar ui-grid-a" style="display:inline;">
<div class="ui-block-a" style="width:35%;text-align:left;">
<label for="mydate" style="margin-top:10px;font-size:10pt;"><b>Compare:</b></label></div>
<div class="ui-block-b" style="width:65%;text-align:left;margin-top:-10px;"><input name="CompareDate" id="mydate" style="height:35px;" type="date" data-role="datepicker" data-options='{"hideInput": true,"mode": "calbox", "useTodayButton": true}'></div></div></div>
<div class="ui-block-b" style="width:20%;text-align:left;margin-left:-5px;">
<select name="select-choice" id="select-choice" data-native-menu="false" data-icon="gear" data-iconpos="notext" >
<option></option>
<option value="auto">Auto</option>
<option value="mix">Mix</option>
<option value="superpose">Superpose</option>
</select></div>
<div class="ui-block-c" style="width:12%;text-align:right;margin-left:2px;">
<a href="#" data-role="button" data-iconpos="notext" data-icon="arrow-l">-12 hours</a></div>
<div class="ui-block-d" style="width:12%;text-align:left;margin-left:3px;">
<a href="#" data-role="button" data-iconpos="notext" data-icon="arrow-r">+12 hours</a></div>
</div><!-- Footer -->
これは次のようになります。
ご覧のとおり、アイコンのないボタンと歯車のアイコンのあるボタンがあります。どちらも同じ選択メニューを表示します。
コード: http: //jsfiddle.net/a7pBW/6/
なぜこれが起こっているのか誰かが知っていますか?きっとバカなことなのに見えない!!
どうもありがとうございます!!
アップデート:
data-native-menuオプションと関係があることがわかりましたが、まだ解決方法がわかりません。
JQueryのバグだと思います。これは、Fire Bugを使用してコードを実行すると、アイコン付きの選択をHTMLの内部に配置すると、ボタンへの2つの参照を見つけることができるためです。これが繰り返される理由です。私はまだそれを解決する方法がわかりません、私はちょうど同じ正確な位置に両方を配置することに取り組んだので、1つではなく2つのボタンがあることがわかりませんが、これは良い方法ではないので作業を続けます!