使用JSON数据填充HTML5下拉值

socialMatrix

我有美国各州的JSON数据,如下所示

{"States":["Alaska","Alabama","Arkansas","American Samoa","Arizona","California","Colorado","Connecticut","District of Columbia","Delaware","Florida","Federated States of Micronesia","Georgia","Guam","Hawaii","Iowa","Idaho","Illinois","Indiana","Kansas","Kentucky","Louisiana","Massachusetts","Maryland","Maine","Marshall Islands","Michigan","Minnesota","Missouri","Northern Marianas","Mississippi","Montana","North Carolina","North Dakota","Nebraska","New Hampshire","New Jersey","New Mexico","Nevada","New York","Ohio","Oklahoma","Oregon","Pennsylvania","Puerto Rico","Palau","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Virginia","Virgin Islands","Vermont","Washington","Wisconsin","West Virginia","Wyoming","Armed Forces Europe, the Middle East, and Canada","Armed Forces Pacific","Armed Forces Americas"]}

现在在我的网络应用中,我反序列化JSON并绑定到HTML5下拉列表以获取关注

在此处输入图片说明

我想要达到的目标是:如何修改JSON数据,以便当我绑定到下拉列表时,Value是状态代码,文本是完整的状态名称,所以像这样

  <option value="IL">Illinois</option>
布莱斯

请注意,元素属性中optionsoptionsTextdata-bind<select>

如果您的json是:

States:[
    { name:'Illinois', value:'IL'},
    { name:..., value:...},
    ....
]


<select data-bind="
    options: value, // IL, ... 
    optionsText: name, // Illinois, ...
    value: lead().state, 
    optionsCaption: 'Choose state...'">
</select>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章