JQuery Mobile在listview中选择，与KnockoutJs绑定

Question

当我尝试在JQM列表视图中使用select时，我遇到了问题。

我有一个列表视图列出了几台计算机，在每个列表项中，用户都可以通过下拉列表对计算机进行一些更改。

结果如下：

我正在使用knockoutjs将viewModels绑定到视图。

这是我的列表视图：

<div data-role="page" id="page1">
<div data-role="content">
    <ul id="editComputerList" data-role="listview" data-inset="true">
        <li data-role="list-divider">
            <div class="row">
                <div class="column">
                    PC
                </div>
                <div class="column">
                    Lokasjon
                </div>
                <div class="column">
                    OS
                </div>
                <div class="column-last">
                    Språk
                </div>
            </div>
        </li>
        <!-- ko foreach: Computers -->
        <li>
            <div class="row">
                <div class="column" data-bind="text: Name">
                </div>
                <div class="column">
                    <select data-bind="value: Location, options: $root.Locations, optionsText: 'Name', optionsValue: 'Value'">
                    </select>
                </div>
                <div class="column">
                    <select data-bind="value: OsParameter, options: $root.OsParameters, optionsText: 'Name', optionsValue: 'Value'">
                    </select>
                </div>
                <div class="column-last">
                    <select data-bind="value: Language, options: $root.Languages, optionsText: 'Name', optionsValue: 'Value'">
                    </select>
                </div>
            </div>
        </li>
        <!-- /ko -->
    </ul>
</div>
</div>

我在这里将模型绑定到视图：

var viewModel = new pageViewModel();
ko.applyBindings(viewModel, document.getElementById("page1"));
$("#editComputerList", "#page1").listview("refresh");
$('#editComputerList select').selectmenu();
$('#editComputerList select').selectmenu('refresh', true);

代码可以在这里看到：http://jsfiddle.net/dankli/7hJ5d/

有没有人知道我做错了什么或者它是JQM中的错误？

Answer 1

我通过在select上设置data-role =“none”来修复此问题。

<select data-role="none" ...></select>

但我不知道这是否可行。