javascript - 標籤技術，是怎麼實現的？

後台是用ThinkPHP架構的，前台頁面呈現的Tag標籤技術，怎麼實現呢？
就比如segmentFault的這種標籤技術？
在“問題”這張表格裡有一個叫做tag的欄位？
怎麼實現像segmentFault的這種標籤效果呢？

更具體的問題在這裡：
https://segmentfault.com/q/1010000004909...

回複內容：

後台是用ThinkPHP架構的，前台頁面呈現的Tag標籤技術，怎麼實現呢？
就比如segmentFault的這種標籤技術？
在“問題”這張表格裡有一個叫做tag的欄位？
怎麼實現像segmentFault的這種標籤效果呢？

更具體的問題在這裡：
https://segmentfault.com/q/1010000004909...

使用select2、tag-it等等，我使用的是tag-it。
整個的流程大致是：在輸入框輸入字元的時候，會把當前的value值與資料庫中的資料對比(ajax請求,data參數就是當前的value值)，看看是否有備選項，如下面這樣：

有的話，後台就返回相應的value和id，直接選中添加即可；
沒有的話就是新建立標籤：

sf的邏輯是這樣的：當你建立新標籤的時候，後台直接建立，然後返回相應的id值。它是把建立標籤作為了一個單獨的過程，和當前提問或發表文章並不是“100%掛鈎”，即當你建立一個新標籤之後，你又取消了相關的提問，這時雖然你沒有提問，但是你建立的標籤已經在資料庫中存在了，下次搜尋標籤時這個標籤已經作為備選項存在了。關於是在建立新標籤的時候就寫入到資料庫中還是在最後一步點擊“提交”時再寫入資料庫，Tag-it外掛程式的使用：如何傳遞額外資料給伺服器？，我在這個問題的答案最後簡單討論了一下，有興趣的可以看一下。

最後提交時，擷取每個標籤的id值，與問題的id值再關聯起來，就知道每個問題對應哪些標籤了。

問題表 標籤表 問題標籤關聯表
標籤應該還有一級二級之分吧 也就是每個標籤需要記錄它的父級標籤

樓上所述方法是利用傳統SQL來實現，我說一個利用NoSQL來實現的。

題主可以看一下這本書：

Redis入門指南

其中有一章講到了 利用Redis 來實現你描述的需求。

最後提交的時候，應該怎麼取得已選擇的標籤的內容呢？
我的意思是說，最後，已經選擇的標籤的內容，應該要記錄進資料庫吧，怎麼取出，已經選擇的標籤的列表呢？

嗯，主要的問題是，怎麼從隱藏欄位裡移除已經添加的tag？

實現這樣的效果從代碼層方面，有兩種方法：
首先來說第一種，一開始就把所有的父類ID和子類ID標籤資料都讀取出來顯示在頁面上(利用CSS顯示、隱藏)，然後jquery事件，click或者focus來切換選中的父類標籤，來展示父類標籤對應的子類標籤；這種方法顯示效果最快，但是一開始就讀取了資料，資料量大的時候對載入會有那麼一點點影響，但問題應該不是很大；

第二種就是，利用ajax的原理實現，實現局部重新整理，同樣的需要用到jquery事件，click或focus，選中時候獲得父類標籤ID，拿到ID用ajax傳遞到後台，從資料庫讀取資料返回前台，重新整理子標籤；這種即時顯示資料的效果擷取可能會差點，但避免了方法一的一開始就載入大量資料拖慢效率的缺點；

還有一種，利用緩衝；

