Question

使用jQM 1.4，我正在制作一个自定义select窗口小部件，其中包含[data-role='toggleselect']，如下所示：

<select data-role="toggleselect">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>

为此，我需要我的select元素不被增强。根据我在jQM 1.4 API here 中所读到的内容并理解，我应该可以使用以下内容来阻止我select由主要mobile.selectmenu小部件增强：

$( document ).on( "mobileinit", function() {
    $.mobile.selectmenu.prototype.initSelector += ":not(:jqmData(role='toggleselect'))";
});

这是我的jsfiddle，表明这不起作用。我的select元素仍在增强中。并且是，这是在加载jQuery之后但在jQM之前放置的。

为了进一步实验，我将以下initSelector硬编码到mobile.selectmenu小部件下的jQM-1.4.js文件中：

initSelector: "select:not(:jqmData(role='slider')):not(:jqmData(role='flipswitch')):not(:jqmData(role='toggleselect'))"

如果这是硬编码，我的select 不已增强，因此按预期工作。

下面是我的文件的复制/粘贴：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>mobile.toggleselect</title>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script>
            $( document ).on( "mobileinit", function() {
                $.mobile.selectmenu.prototype.initSelector += ":not(:jqmData(role='toggleselect'))";
            });
        </script>
        <script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
    </head>
    <body>
        <div data-role="page">
            <div data-role="header">
                <h3>mobile.toggleselect</h3>
            </div>
            <div data-role="content">
                <select data-role="toggleselect">
                    <option value="1">One</option>
                    <option value="2">Two</option>
                    <option value="3">Three</option>
                </select>
            </div>
        </div>
    </body>
</html>

同样，如果我下载jquery.mobile-1.4.0.js文件的本地副本并对initSelector的{{1}}进行硬编码，则会按预期工作。

所以...我错过了什么？或者这是一个错误吗？

Answer 1

在jQuery Mobile API 1.4文档中看起来像是一个错误。

分配自定义 initSelector

$.mobile.widget.initSelector = ".selector";

<强> Demo

mobileinit initSelector不工作

1 个答案: