jQuery InputTags插件是一款用于快速創建輸入標簽的jQuery插件。該插件可以實現一個輸入框,用戶可以輸入多個標簽,每個標簽使用回車鍵或逗號進行分隔。隨著用戶輸入標簽,插件會自動為其添加到一個標簽容器中,用戶可以隨時修改和刪除這些標簽。
<div id="input-tags"></div> <input type="text" id="input" name="input" /> <script> $('#input-tags').inputTags(); </script>
上述代碼中,我們在HTML中創建了一個容器div來顯示標簽。同時,我們使用一個普通的輸入框來允許用戶輸入標簽,通過調用inputTags()函數來將該輸入框轉換為輸入標簽框。用戶可以輸入多個標簽,使用回車鍵或逗號來分隔標簽。
除了基本的功能,該插件還提供了多種選項,可以根據需要進行配置。例如,您可以修改標簽容器的樣式,更改標簽的分隔符,定義允許的最大標簽數,添加自定義校驗等等。
$('#input-tags').inputTags({ maxNum: 10, splitChar: ';', onValidate: function(tag) { if (tag.length >10) { alert('標簽最長不能超過10個字符'); return false; } return true; } });
在上述示例中,我們使用了一些插件選項來修改標簽的分隔符為';',同時設置允許的最大標簽數為10。我們還定義了一個onValidate回調函數,用于校驗用戶輸入的標簽。如果標簽長度超過10個字符,則該回調函數將返回false,同時彈出一個警告框,告訴用戶不符合規定。
總之,jQuery InputTags插件是一款非常有用的插件,可以方便地創建和管理標簽。如果您的網站需要使用輸入標簽功能,那么該插件將是您的不二之選。