2011-04-25 30 views
0

我的用於驗證的自定義CSS是用紅色邊框勾勒出該元素。適用於輸入,但不適用於選擇,收音機和複選框,因爲jQM會爲這些標籤添加自己的標記。JQM(jQueryMobile)無效選擇的自定義css

所以我有這樣的CSS和它的輸入標籤的偉大工程,只是沒有選擇,收音機和複選框

/* html5 */ 
input[type='text'], 
input[type='number'], 
input[type='email'], 
textarea, select { 
    border: solid 1px #999; 
} 
input[type='text'].focus, 
input[type='number'].focus, 
input[type='email'].focus, 
textarea.focus, select.focus { 
    border-color: #000 !important; 
} 
input[type='text'].invalid, 
input[type='number'].invalid, 
input[type='email'].invalid, 
textarea.invalid, select.invalid { 
    border-color: red; 
} 
input[type='text'].inactive, 
input[type='number'].inactive, 
input[type='email'].inactive, 
textarea.inactive, select.inactive, option.inactive { 
    color: #999; 
    font-style: italic; 
} 
input[type='text'].required, 
input[type='number'].required, 
input[type='email'].required, 
textarea.required { 
    background: url(../images/asterisk_red.png) right 5px no-repeat; 
} 

回答

2

在jQuery Mobile的,選擇,收音機和複選框元素完全與其他元素取代在DOM中(實際上,它們被設置爲隱藏並且DOM元素被放置在它們之上,但效果是相同的。)。因此,要將樣式應用於這些元素,您必須將樣式應用於與您預期不同的選擇器。對於單選按鈕,您必須將樣式應用於.ui-radio .ui-btn

找出需要的樣式的最佳方法是使用類似於螢火蟲或瀏覽器的開發人員工具來檢查各個元素,因爲類取決於你如何配置表單元素,使用可能會稍有不同。