Php jquery@提到了输入ajax函数

我正在尝试使用添加@提及功能到我的网站。我试图从一个.php文件中获取一个JSON响应，该文件查询数据库

onkeyup

，但是我不知道在代码中把ajax调用放在哪里

我知道我要求人们基本上为我做这项工作，但我在这里快死了，我已经尝试了大约2-3天了

这里是插件中的两个JavaScript函数，我只是一个示例ajax函数，它将链接到我的PHP脚本，搜索用户

%，比如%

查询

插件的基本示例

$(function () {
$('textarea.mention').mentionsInput({
onDataRequest:function (mode, query, callback) {
var data = [
{ id:1, name:'Kenneth Auchenberg', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:2, name:'Jon Froda', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:3, name:'Anders Pollas', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:4, name:'Kasper Hulthin', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:5, name:'Andreas Haugstrup', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:6, name:'Pete Lacey', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:7, name:'kenneth@auchenberg.dk', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:8, name:'Pete Awesome Lacey', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
{ id:9, name:'Kenneth Hulthin', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' }
];
data = _.filter(data, function(item) { return item.name.toLowerCase().indexOf(query.toLowerCase()) > -1 });
callback.call(this, data);
}
});
$('.get-syntax-text').click(function() {
$('textarea.mention').mentionsInput('val', function(text) {
alert(text);
});
});
$('.get-mentions').click(function() {
$('textarea.mention').mentionsInput('getMentions', function(data) {
alert(JSON.stringify(data));
});
}) ;
});

AJAX示例（我不知道如何从.php文件获取JSON）

---

我已经在上读了一些关于插件的内容，我不确定你有什么，但这就是你需要让它工作的东西：

jqueryjs文件和插件脚本

JS代码：

$(function () {  
    $('textarea.mention-example2').mentionsInput({    
        onDataRequest:function (mode, query, callback) { 
            $.getJSON('assets/data.json', function(responseData) {        
                responseData = _.filter(responseData, function(item) { 
                    return item.name.toLowerCase().indexOf(query.toLowerCase()) > -1 });                   callback.call(this, responseData);      
            });
        }  
    });
}); 

文件名为data.JSON“assets/data.JSON”的文件夹assets中的JSON文件：

[
    {        
        "id": 1,
        "name": "Kenneth Auchenberg",
        "avatar": "http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif",
        "type": "contact"    
    }
]

---

现在，您所需要的只是一个带有类的文本区域——示例2。您可能还需要包含一些css文件。但是试一下，然后带着反馈回来。

我想出来了，我只是添加了一个变量查询，值为query，并将其发送到我的脚本，然后脚本搜索数据库并返回结果

$('textarea.mention-example2').mentionsInput({
onDataRequest:function (mode, query, callback) {
    var myquery = 'query='+query;
  $.getJSON('data.php', myquery, function(responseData) {
    responseData = _.filter(responseData, function(item) { return item.name.toLowerCase().indexOf(query.toLowerCase()) > -1 });

    callback.call(this, responseData);
  });
}

---

}))

我在codeigniter中就是这样做的

创建一个函数来为我获取数据

function getDataMention(mode, query, callback){
          var path = '<?=site_url()?>users/get_user_search_string/'+query;
          $.ajax({
            url: path,
             dataType: 'json', // Choosing a JSON datatype
          }).done(function(retdata) {
           var data = retdata;
           data = _.filter(data, function(item) {return item.name.toLowerCase().indexOf(query.toLowerCase()) > -1 });
           callback.call(this, data);
          });                      
}//end getDataMention();

函数getDataTitle（模式、查询、回调）{ var path='users/get\u user\u search\u string/'+query； $.ajax({ url:path， 数据类型：“json”，//选择json数据类型 }).done（函数（retdata）{ var数据=retdata； data=u2;.filter（数据，函数（项）{return item.name.toLowerCase（）.indexOf（query.toLowerCase（））>-1}）； callback.call（这个，数据）； }); }//end getdatantion（）； 然后在文档准备就绪时调用库

$('textarea.mention').mentionsInput({
        onDataRequest:getDataMention,
        minChars: 1,
        templates:{
          wrapper: _.template('<div class="mentions-input-box"></div>'),
          autocompleteList: _.template('<div class="mentions-autocomplete-list"></div>'),
          autocompleteListItem: _.template('<li data-ref-id="<%= id %>" data-ref-type="<%= type %>" data-display="<%= display %>"><%= content %></li>'),
          autocompleteListItemAvatar : _.template('<img src="<%= avatar %>" />'),
          autocompleteListItemIcon: _.template('<div class="icon <%= icon %>"></div>'),
          mentionsOverlay: _.template('<div class="mentions"><div></div></div>'),
          mentionItemSyntax: _.template('@[<%= value %>](<%= type %>:<%= id %>)'),
          mentionItemHighlight: _.template('<a target="__blank" class="mlink" href="<?=site_url()?>users/profile/profile_id=<%= id %>"><%= value %></a>')
        }
      });

$（'textarea.notice'）.noticesInput({
onDataRequest:GetDataEntry，
明查斯：1，
模板：{
包装器：。模板（“”），
自动完成列表：\ u0.template（“”），
autocompleteListItem:u.template（“
”），
autocompleteListItemAvatar:513;.模板（“/>”），
autocompleteListItemIcon:u.template（“”），
提及日期：u.模板（“”），
NitementItemSyntax:uz.template（'@[]（：）'），
提及项突出显示：u.template（“”）
}
});

用于对服务器或php文件的ajax调用

$('textarea.mention').mentionsInput({
        onDataRequest:getDataMention,
        minChars: 1,
        templates:{
          wrapper: _.template('<div class="mentions-input-box"></div>'),
          autocompleteList: _.template('<div class="mentions-autocomplete-list"></div>'),
          autocompleteListItem: _.template('<li data-ref-id="<%= id %>" data-ref-type="<%= type %>" data-display="<%= display %>"><%= content %></li>'),
          autocompleteListItemAvatar : _.template('<img src="<%= avatar %>" />'),
          autocompleteListItemIcon: _.template('<div class="icon <%= icon %>"></div>'),
          mentionsOverlay: _.template('<div class="mentions"><div></div></div>'),
          mentionItemSyntax: _.template('@[<%= value %>](<%= type %>:<%= id %>)'),
          mentionItemHighlight: _.template('<a target="__blank" class="mlink" href="<?=site_url()?>users/profile/profile_id=<%= id %>"><%= value %></a>')
        }
      });