Knockout.js选择列表在ios上异常运行 [英] Knockout.js select list acting erratically on ios

问题描述

我有几个选择框在ios中不规律地动作。我运行cordova 1.8.1，并在我的页面上运行一个knockout.js应用程序。当我在项目选择器中选择一个项目时，它被选中，但列表中的所有其他项目也被选中。现在，就我可以告诉正确的项目被选择和报告，当我提交表单，但它看起来真的很糟糕的用户，可能会很混乱。我在做什么花哨，这里是代码：

 < select class =dropdownList1style ='width：35 ％; left：28％; position：absolute;'data-bind =value：ContactUsForm.Month，options：ContactUsForm.Months，optionsCaption：'Month'>< / select& 
  

但是这里是我选择月份7的结果：

>

这不是一个muti选择框。在我看来，这里的错误是在iOS中，但我的怀疑是，当我选择一个值，Knockout也做一些重新渲染。在正常的浏览器中，框快照关闭，所以你永远不会看到一个中间状态，但是使用ios，框保持打开，直到你点击完成。

解决方案

当Knockout更新下拉列表中的项目时，会导致此问题。但即使 ContactUsForm.Months 从不改变，Knockout仍会在值更改时（如选择项目时）更新项目。请参阅 RP Niemeyer 的文章 Knockout.js Performance Gotcha＃3 - All Bindings Fire Together 有关此问题的更多详情。

$ b $我认为他提出的解决方案会为你工作。不要使用选项绑定，应该使用 isolatedOptions 绑定。 （另外 value 绑定应始终在选项或 isolatedOptions 。）

 < select data-bind =
 isolatedOptions：ContactUsForm.Months，optionsCaption：'Month' ，
 value：ContactUsForm.Month>< / select> 
  

I have a few select boxes that are acting erratically in ios. I'm running cordova 1.8.1 and have a knockout.js application running on my page. When I select an item in the item picker, it gets selected but so do all the other items on the list. Now, as far as I can tell the proper item is being selected and reported when I submit the form, but it looks really really bad to the user and could be very confusing. I'm doing anything fancy, here is the code:

<select class="dropdownList1" style='width:35%;left:28%;position:absolute;' data-bind="value:ContactUsForm.Month,options:ContactUsForm.Months,optionsCaption: 'Month'"></select>

But here is the result when I pick 7 for the month:

This is NOT a muti select box. It seems to me that the error here is in iOS, but my suspicion is that Knockout is also doing some re rendering when I select a value. In normal browsers the box snaps shut so you never see an 'intermediate' state, but with ios, the box stays open until you click 'done'.

解决方案

This problem is caused when Knockout updates the items in the drop-down. But even if ContactUsForm.Months never changes, Knockout still updates the items whenever the value changes, such as when you select an item. See RP Niemeyer's article Knockout.js Performance Gotcha #3 - All Bindings Fire Together for more details on this problem.

I think a solution he presents there will work for you. Instead of using the options binding, you should use his isolatedOptions binding. (Also the value binding should always be after options or isolatedOptions.)

<select data-bind="
    isolatedOptions:ContactUsForm.Months, optionsCaption:'Month', 
    value:ContactUsForm.Month"></select>

这篇关于Knockout.js选择列表在ios上异常运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！