如何在文本框中創建臉譜風格標記朋友

Question

我想在用於創建博客帖子的應用程序上使用臉譜風格的朋友標記器。如果用戶輸入@符號，然後開始輸入朋友的姓名（從用戶表中），則應用程序將查找，然後用戶將從列表中選擇姓名。在選擇名稱後，它會發送一封電子郵件，提及您在博客文章xyz等中的標籤。經過廣泛的搜索後，我在http://www.9lessons.info/2010/08/tag-friends-with-jquery-ajax-and-php.html發現了類似的腳本。但是我想知道是否有更多的例子？或jQuery的擴展爲此？

Answer 1

這不需要太多時間來研究編碼自己。使用javascript/jQuery來檢測@符號，並啓動ajax函數以在該人員朋友列表中查找匹配的用戶。也許爲每個用戶的朋友生成一個xml/json文件，這樣你可以更快地訪問它們，而無需對數據庫進行額外的查詢。然後在一個簡單的CSS div中顯示用戶名以供他們選擇。當他們選擇一個名稱時，它將@符號後面的所有內容替換爲所選名稱。然後發射另一個Ajax函數來觸發並記錄該用戶的消息以查看他們何時登錄下一個。

我知道我們都在這裏的不同層次，但如果你熟悉php，javascript/jquery和ajax調用，你應該可以粉碎一些咖啡並在幾個小時內完成。 :)

Answer 2

這裏有一個jQuery插件。這裏檢查演示：

http://loopj.com/jquery-tokeninput/

插件的閱讀文檔獲取更多信息。總之：

• 你需要在客戶端使用這個插件。

• 生成JSON在以下服務器上的格式，並通過腳本文件的URL這個插件

  [ { 「ID」： 「856」， 「名」： 「豪斯醫生」}， { 「ID」 ：「1035」，「名」：「絕望主婦」}， ... ]

• 綁定使用onAdd事件偵聽器，這個插件和發送Ajax請求到某些服務器端腳本來發送電子郵件。