iPhone / iPad上的jQuery Mobile滑动面板和复选框问题

时间:2013-08-08 08:45:12

标签: jquery jquery-mobile panel checkboxlist

有没有人遇到过这个问题?

在iPhone或iPad上的同一页面上混合使用jQuery滑动面板和jQuery垂直复选框列表会导致复选框列表行为异常。

每个都可以自行运行,但当两者在同一页面上时会出现问题。

问候。

我添加了一些代码来显示问题。注释掉面板会使复选框列表按预期工作。

<!DOCTYPE html>
<html>
<head>

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

</head>
<body>

    <div data-role="page" id="Move">

        <div data-role="panel" id="defaultpanel">
            <div class="panel-content">
                <ul data-role="listview">
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                    <li>
                        <a href="#" data-icon="custom" data-transition="none">Test</a></li>
                </ul>
            </div>
        </div>

        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup">
                <legend>Choose as many snacks as you'd like:</legend>
                <input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" />
                <label for="checkbox-1a">Cheetos</label>

                <input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom" />
                <label for="checkbox-2a">Doritos</label>

                <input type="checkbox" name="checkbox-3a" id="checkbox-3a" class="custom" />
                <label for="checkbox-3a">Fritos</label>

                <input type="checkbox" name="checkbox-4a" id="checkbox-4a" class="custom" />
                <label for="checkbox-4a">Sun Chips</label>
            </fieldset>
        </div>

    </div>
</body>

0 个答案:

没有答案