2017-01-12 93 views
0

完成使用這種問答http://stackoverflow.com/questions/17838380/styling-jquery-ui-autocomplete選擇風格在現場

我可以樣式的所有汽車上我的網站上完成。不過,我只想將WIDTH樣式應用於一個特定的自動完成文本字段。

 <script> 
    $(function() { 
    var availableCountries = [ 
"Country1", 
    "Country2", 
    "Country3", 
    ]; 
    $("#tbCountries").autocomplete({ 
     source: availableCountries 
    }); 
    }); 
    </script> 



<input id="tbCountries" type="text" class="textEntry form-control RegistrationPage-AutoCompleteCountryWidth" maxlength="30"> 

伊夫試圖訪問它通過輸入ID並且還加入了類,這些工作

#tbCountries ul 
{ 
    width:14% !important; 
} 

.RegistrationPage-AutoCompleteCountryWidth ul 
{ 
    width:14% !important; 
} 

無....但...從獲得UL的ID開發者工具,我可以改變所需寬度

#ui-id-1 
{ 
    width:14% !important; WORKING 
} 

但心不是這個壞編碼所以要添加或刪除多個自動從我的網站上完成可以改變這一個的ID說話?

任何想法? Ta

+0

document.getElementsByClassName( 「yourclass」)[0] .style.width =「14 %!重要「; –

回答

0

您嘗試選擇一個ul元素作爲輸入的子元素。 在CSS中,您可以在選擇器之間選擇元素的子元素。

嘗試此替代(只是不ul childselector的ID):

#tbCountries { 
    width:14% !important; 
} 

如需進一步閱讀: https://css-tricks.com/child-and-sibling-selectors/