1

所以我有以下 html/js 代码，它似乎在桌面浏览器上运行良好（至少 IE10+，最新的 FF/Chrome，这是目标受众）：

HTML（显示在 colorbox-overlay 内，使用敲除绑定）：

<li>
    <select id="selectPriceType" class="tsel" name="selectPriceType" data-bind="value: priceSetting">
        <option value="hide">Keinen Preis anzeigen</option>
        <option value="line">Preis pro Menülinie</option>
        <option value="calc">Preis pro Menü</option>
    </select>
    <div class="price-type"></div>
    <div class="price-type">
        <div class="clear"></div>
        <div class="menu-price-list" data-bind="foreach: menuLinePrices">
            <div class="menu-line-price">
                <label data-bind="text: text"></label>
                <span>€&lt;/span> <input type="text" data-bind="value: price" name="inputpriceline#12776" id="inputpriceline#12776" />
                <div class="clear"></div>
            </div>
            <div class="clear"></div>
        </div>

    </div>
    <div class="price-type">
        <div class="price-space">
            <fieldset>
                <legend>Ausgabepreis:</legend>
                <dl>
                    <dt><label class="rb" data-bind="css:{ checked : surcharge() == 'no'}">Ohne Aufschlag<input type="radio" value="no" class="styled-input" data-bind="checked: surcharge" name="surcharge" id="rbtnSurchargeNone" /></label></dt>
                   ...
                </dl>
            </fieldset>
            <fieldset>
                <legend>MwSt:</legend>
                <label class="rb" data-bind="css:{ checked : vat() == '0'}">keine Angabe<input type="radio" class="styled-input" data-bind="checked: vat" value="0" name="vat"></label>
               ...
            </fieldset>
        </div>
    </div>
</li>

我的 JS-Inithandler 查找在敲除中定义的变量，并且应该根据选项的值（“hide”、“line”、“calc”）显示/隐藏 html 元素：

pricetype = {
            init: function () {
                $('#selectPriceType').change(function () {
                    $(this).siblings('.price-type').hide().eq(this.selectedIndex).show();
                    $.colorbox.resize();
                }).change();
            }
        }

在我的 document.ready 中它是这样调用的：

$(document).ready(function () {
            initHelpContents();
            InitPrintCockpit(); //here my variable is set to 'calc'
            printCockpitPageModel.menuplanid('###MenuPlanId###');
            $("select").transformSelect();
            $("a.btn-generic").colorbox({ inline: true, width: "905px", close: "" });
            accordion.init();
            footerNav.init();
            pricetype.init();

            changeSettingHint.init();

            $('.reset').click(function () {
                $('#cboxClose').click();
            });

            // $(document).ready() may execute before css styles are applied and wrong font-family or font-size may result in wrong scrollHeight.
            $(window).load(function () {
                $('#Menue').find('textarea').change();
            })
        });

如前所述，在桌面浏览器上一切正常。但是在移动浏览器上打开它（在 ipad / latest safari 和 android4 / chrome 32 和内置“浏览器”上测试）会导致奇怪的行为。似乎整个“init”部分没有被执行。显示每个 div，而不仅仅是我通过淘汰赛设置的那个。我试图通过 chrome 调试器工具查找它，但在控制台上没有得到任何输出。我也试着看看里面有什么this.selectedIndex，但也很好。然后我尝试$("select").transformSelect();从我的文档准备中删除“ta-daa”，它似乎像一个魅力。

我在这里使用了 fancyforms 1.4.2 ( http://plugins.jquery.com/Fancyform/ )，谷歌搜索并没有给我答案，所以我希望你们中的一些人能在这里帮助我，因为我真的很忙现在的想法。

4

0 回答 0