0

我正在尝试在 jQuery Mobile 上复制 Flip Switch的演示代码

<form>
    <div data-role="fieldcontain">
        <label for="flip-7">Flip toggle switch:</label>
        <select name="flip-7" id="flip-7" data-role="slider" data-mini="true">
            <option value="off">Off</option>
            <option value="on">On</option>
        </select>
    </div>
</form>

针对这样的事情： 屏幕截图

但我最终得到这样的结果： 在此处输入图像描述

这让我发疯，因为我知道我的 JQuery Mobile 脚本正在加载，但我似乎没有得到他们认为应该得到的相同结果。这基本上发生在大多数项目上，特别是处理表单和弹出窗口。我尝试上课等等，但无济于事。

大家有这方面的参考技巧吗？

4

2 回答 2

1

现在我遇到了你的问题，它不是你的问题，它是基本问题，jquery 只应用于 dom 中的元素而不是运行时这个问题也发生在我身上。可能有两种解决方案

.trigger("create")尝试使用新内容调用元素。

根据 jQuery Mobile 文档，“create 事件适用于增强包含一个或多个小部件的原始标记。”

或再次加载 jquery.mobile。

于 2013-03-01T07:07:08.337 回答
0

这是整个代码（在 google chrome 中测试）：确保您在浏览器上启用了 javascript。

<!DOCTYPE HTML>
<HTML>
<head>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css">
<script src='http://code.jquery.com/jquery-1.9.1.min.js'></script>
<script src='http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js'></script>
</head>
<body>
<form>
<div data-role="fieldcontain">
    <label for="flip-7">Flip toggle switch:</label>
    <select name="flip-7" id="flip-7" data-role="slider" data-mini="true">
        <option value="off">Off</option>
        <option value="on">On</option>
    </select>
</div>
</form>
</body>
</HTML>
于 2013-03-01T06:32:14.770 回答