这两个 URL 指向的文件除了一件事外是相同的:
mobileCSS.html
文件包含这一行:
<link rel="stylesheet" href="/code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.css">
noCSS.html
文件已注释掉同一行:
<!--link rel="stylesheet" href="/code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.css"-->
两个页面都使用 AngularJS 来填充两个 <select>
元素,其中一个充当另一个的奴隶。两者还包含一组复选框以显示模型的内部状态。
当 jquery.mobile-1.4.3.css
使用:
<select>
的初始值元素不显示- 复选框输入不更新
这是一个已知问题吗?您能为此建议一个解决方法吗?
部分解决方案:correctedCSS.html
这表明 jQueryMobile 没有正确更新,并且它添加的修饰隐藏了 <select>
的事实和 <checkbox>
AngularJS 正在正确更新元素:
.ui-checkbox .ui-btn {
z-index:0; /* in jquery.mobile-1.4.3.css, this is set to 2 */
}
.ui-select .ui-btn select {
opacity:1; /* in jquery.mobile-1.4.3.css, this is set to 0 */
}
Screenshots http://dev.lexogram.com/tests/angularJS/angularVSjqueryMobile.png
最佳答案
我不太擅长 Angular ,因为我也处于学习阶段,但据我所知,像下面的代码这样的东西可以提供帮助。
JS
$scope.endonyms = [{code: "en", name: "English" }, { code: "fr", name: "Français" }];
$scope.selectedOption = $scope.endonyms[2];
HTML:
<select ng-options="endonym as endonym.name for endonym in endonyms"
ng-change="setSource()" ng-model="selectedOption">
关于jQueryMobile 的 CSS 破坏了 AngularJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24930153/