jQuery选择内部弹出窗口不能与Android一起使用

时间:2013-08-22 13:24:17

标签: jquery select mobile popup

这是我的问题。

我将一个select标签(动态)放入一个jQuery弹出窗口,除了我的三星Galaxy S1之外,它在除了浏览器之外的每个平台浏览器上都能正常工作。 选择不会下降。如果我尝试在不使用jQuery的情况下将其设置为原生,则问题仍然存在。

在弹出窗口之外添加此选择标记将在我的SGS 1上正常工作。 我的代码有什么问题?

以下是所涉及代码的示例:

HTML

        <div data-role="popup" id="popABS" data-theme="c">
            <div data-role="header" data-theme="b">
                <h1></h1>
            </div>
            <a href="#" data-rel="back" data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Fermer</a>
            <div data-role="content">
                <div data-role="collapsible-set" data-content-theme="b">
                    <div id="detABS" data-role="collapsible" data-theme="b" data-icon="arrow" data-content-theme="b">
                        <h2>Détail des absences</h2>
                        <table id="table-ABS" class="ui-responsive table-stroke" data-role="table" data-mode="reflow">
                            <thead>
                                <tr>
                                    <th>&nbsp;</th>
                                    <th>Code</th>
                                    <th>Libellé</th>
                                    <th>Début</th>
                                    <th>Fin</th>
                                    <th>Niveau</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                    <div id="ajABS" data-role="collapsible" data-theme="b" data-content-theme="b" style="display:none;">
                        <h2>Demande d'absence</h2>
                        <fieldset id="jouh" data-role="controlgroup" data-mini="true" data-type="horizontal">
                            <input type="radio" name="typabs" id="typabs-j" value="J" checked="checked" />
                            <label for="typabs-j">Jour</label>

                            <input type="radio" name="typabs" id="typabs-h" value="H"  />
                            <label for="typabs-h">Heures</label>
                        </fieldset>
                        <div id="demJ">
                            <fieldset class="ui-grid-c" style="width:450px;">
                                <div class="ui-block-a labels" style="width:50px;">
                                    <label for="deb" data-inline="true">Du :</label>
                                </div>
                                <div class="ui-block-b" style="width:100px;">
                                    <input type="text" name="deb" id="deb" value="" maxlength="10" data-inline="true" data-mini="true">
                                    <input type="hidden" id="altdeb" value="">
                                </div>
                                <div class="ui-block-c" style="width:40px;">
                                    <div class="ui-icon-nodisc">
                                        <a id="caldeb" data-role="button" data-icon="grid" data-iconpos="notext" data-theme="b" data-iconshadow="false" data-inline="true"></a>
                                    </div>
                                </div>
                                <div class="ui-block-d" style="width:200px;">
                                    <fieldset data-role="controlgroup" data-mini="true" data-type="horizontal">
                                        <input type="radio" name="ajpdeb" id="ajpdeb-j" value="2" checked="checked" />
                                        <label for="ajpdeb-j">Jour</label>

                                        <input type="radio" name="ajpdeb" id="ajpdeb-a" value="1"  />
                                        <label for="ajpdeb-a">Matin</label>

                                        <input type="radio" name="ajpdeb" id="ajpdeb-p" value="3"  />
                                        <label for="ajpdeb-p">Soir</label>
                                    </fieldset>
                                </div>
                                <div class="ui-block-a labels" style="width:50px;">
                                    <label for="deb">Au :</label>
                                </div>
                                <div class="ui-block-b" style="width:100px;">
                                    <input type="text" name="fin" id="fin" value="" maxlength="10" data-inline="true" data-mini="true">
                                    <input type="hidden" id="altfin" value="">
                                </div>
                                <div class="ui-block-c" style="width:40px;">
                                    <div class="ui-icon-nodisc">
                                        <a id="calfin" data-role="button" data-icon="grid" data-iconpos="notext" data-theme="b" data-iconshadow="false" data-inline="true"></a>
                                    </div>
                                </div>
                                <div class="ui-block-d" style="width:200px;">
                                    <fieldset data-role="controlgroup" data-mini="true" data-type="horizontal">
                                        <input type="radio" name="ajpfin" id="ajpfin-j" value="2" checked="checked" />
                                        <label for="ajpfin-j">Jour</label>

                                        <input type="radio" name="ajpfin" id="ajpfin-a" value="1"  />
                                        <label for="ajpfin-a">Matin</label>

                                        <input type="radio" name="ajpfin" id="ajpfin-p" value="3"  />
                                        <label for="ajpfin-p">Soir</label>
                                    </fieldset>
                                </div>
                            </fieldset>
                        </div>
                        <div id="demH" style="display:none;">
                            <fieldset class="ui-grid-c" style="width:450px;">
                                <div class="ui-block-a labels" style="width:50px;">
                                    <label for="date" data-inline="true">Date :</label>
                                </div>
                                <div class="ui-block-b" style="width:100px;">
                                    <input type="text" name="date" id="date" value="" maxlength="10" data-inline="true" data-mini="true">
                                    <input type="hidden" id="altdate" value="">
                                </div>
                                <div class="ui-block-c" style="width:40px;">
                                    <div class="ui-icon-nodisc">
                                        <a id="caldate" data-role="button" data-icon="grid" data-iconpos="notext" data-theme="b" data-iconshadow="false" data-inline="true"></a>
                                    </div>
                                </div>
                                <div class="ui-block-d labels" style="width:100px;">
                                    <label for="hdeb" data-inline="true">Heure début :</label>
                                </div>
                                <div class="ui-block-e" style="width:90px;">
                                    <input type="time" name="hdeb" id="hdeb" value="" maxlength="5" placeholder="HH:MM" data-inline="true" data-mini="true">
                                </div>
                                <div class="ui-block-a labels" style="width:50px;">
                                </div>
                                <div class="ui-block-b" style="width:100px;">
                                </div>
                                <div class="ui-block-c" style="width:40px;">
                                </div>
                                <div class="ui-block-d labels" style="width:100px;">
                                    <label for="hfin" data-inline="true">Heure fin :</label>
                                </div>
                                <div class="ui-block-e" style="width:90px;">
                                    <input type="time" name="hfin" id="hfin" value="" maxlength="5" placeholder="HH:MM" data-inline="true" data-mini="true">
                                </div>
                            </fieldset>
                        </div>
                        <fieldset class="ui-grid-b" style="width:450px;">
                            <div class="ui-block-a" style="width:100px;">
                                <a href="#" id="rechabs" data-role="button" style="width:80px" data-icon="search" data-mini="true" title="Rechercher les motifs d'absences">Motifs</a>
                            </div>
                            <div id="divmotabs" class="ui-block-b" style="width:350px;">
                            **<-- Here the SELECT is added dynamically -->**
                            </div>
                        </fieldset>
                    </div>
                </div>
            </div>
        </div>

JAVASCRIPT

        var $tab = '<select id="motabs" data-mini="true" data-native-menu="true">';
        for (var $i in motAbs) {
            if (profil['ABS'] != undefined && profil['ABS'] != null && canDo(profil['ABS'].lst.split(';').join(','),motAbs[$i].code))
                $tab+= '<option value="'+motAbs[$i].code+'">'+motAbs[$i].code + " " + motAbs[$i].lib + " (" + motAbs[$i].val +')</option>';
        }
        $tab+= '</select>';
        $('#divmotabs').empty();
        $('#divmotabs').append($tab);
        $('#motabs').selectmenu();

1 个答案:

答案 0 :(得分:0)

我知道这是一个相当古老的帖子,但万一问题仍然存在。

追加“$ tab”

你应该写,$('#motabs')。触发器('create')。selectmenu();

我认为应该有效