【JavaScript】customize select-picker

説明 利用JS與CSS,自定義select-picker的style 用<select>跟<option>做出真選單 隱藏掉<select>(隱藏真選單) 〔JS部分〕 讀取真選單<select>的內容,抓到後會是NodeList形式,給它轉換成陣列 換成陣列後,用mapping method,填充成<li>option內容</li>的形式 做出一個假的option wrapper / open-bar,然後把<li>們放進去 範例 引用函式庫:FontAwesome .selector select option 台灣 option 香港 option 柬埔寨 option 越南 option 緬甸 option 澳洲 option 美國 option 中國 option 澳洲 option 法國 option 印尼 option 英國 br br .selector select option good option apple option orange option red option beauty option […]

【HTML】disabled

説明 disabled是input相關屬性,可以讓input的內容無法編輯、修改。 若text input裡面有文字(value內容),則使用者無法修改 若radio button / checkbox預設為勾選,則使用者無法取消勾選 若radio button / checkbox預設為不勾選,則使用者無法勾選他 範例 text <input type=”text” value=”fixed text” disabled /> radio button <input name=”rd-dis” type=”radio”checked disabled/> <label>radio one</label> <input name=”rd-dis” type=”radio” disabled/> <label>radio two</label> radio one radio two checkbox <input type=”checkbox” checked disabled/> <label>checkbox one</label> <input type=”checkbox” disabled/> <label>checkbox two</label> checkbox one checkbox two select […]

【JavaScript】JS的位置

説明 在HTML檔案中,JS不論是寫在頁面上,或是用檔案引入,都建議放在body後面。 理由:HTML文件的讀取方式是由上而下,如果寫在body前面的話,網頁還沒讀完JS就執行了,所以DOM會抓不到東西。 但若一定要寫在body前面的話,可以在JS內容外面加上一層load事件,讓網頁全部讀完後,再執行JS。 window.addEventListener(“load”, function(){ //這邊放入JS內容。 });