jquery mobile动态生成的下拉列表无法显示默认选择值的问题

最近在项目里面遇到一个问题:用jqm框架做手机界面开发,有一个功能是要动态生成下拉列表,并且进入页面后下拉列表上要显示默认选中的值。

于是采用在原生的html5和js下开发的方法进行数据获取、列表构建和默认选择设置。结果问题出现啦,不管我们用哪一种默认选择option的方法,列表上都不能默认显示我们指定的值,但是发现列表确实是选中了该项,调试了很久不明所以。

解决过程:

1、初步判断是jqm的样式造成的,于是将jqm的js和css文件引用去掉,换成原生的代码,ok,可以显示默认设置的值;

2、既然知道了问题的祸根,我又在页面加入了jqm的两大文件引用,在chrome下显示页面,右键=》审查元素,找到我们的select元素的位置和显示文本的位置;

3、通过比对发现显示文本的位置居然是一个我们根本不知道的家伙(jqm自己添加的div下的span元素),好的,既然知道了它的显示原理,我们就直接操作这个span的text就ok啦。

相关的代码:

$("div.ui-select div.ui-select div span.ui-btn-inner.ui-btn-corner-all span.ui-btn-text").text("默认值");

我这里是根据jquery的选择策略通过引用类来选择的元素。

你可能感兴趣的:(jquery,html5,chrome,mobile,div,审查)