分享 推播通知
目前身份: 訪客

 首先我們要做出上圖的效果要如何做?

 

 先定義script

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.min.js" integrity="sha512-9UR1ynHntZdqHnwXKTaOm1s6V9fExqejKvg5XMawEMToW4sSw+3jtLrYfZPijvnwnnE8Uol1O9BcAskoxgec+g==" crossorigin="anonymous"></script> 

 

接著定義 css

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.css" integrity="sha512-xmGTNt20S0t62wHLmQec2DauG9T+owP9e6VU8GigI0anN7OXLip9i7IwEhelasml2osdxX71XcYm6BQunTQeQg==" crossorigin="anonymous" /> 

 

 

接著放上

<input type="text" data-role="tagsinput" id="ct_post_tags" value="PHP,JSON,JAVA,MYSQL,NODE.JS" />

 

只需要在 input 內,加上 data-role="tagsinput" 

 

問:js 要不要寫呢?

答:不用寫,載入頁面後,它自己就會讀出來了 

Bootstrap Tags Input 發表在 留言 (0) 人氣 (84)
不設分類
分享給朋友
網址

想對外分享這則貼文嗎?運用網址更方便呦~

關於
Bootstrap Tags Input目前是出到 v0.8.0,也已經有四年沒有更新了,最近需要用到input text框,具有能夠輸入多個 tag的效果,所以還是找了bootstrap-tagsinput這一套來使用,過程中也遇到了許多的問題,上網也查了不少的資料,但很多都是沒辦法解決的,最後還是得親自去看源始碼,才得以解決,本頻道就專門介紹Bootstrap Tags Input的相關用法,用到哪寫到哪,有使用上經驗的朋友,也可以分享你使用的經驗與方法。
OnceHit© 2020
載入中...