在下面的代码中,自动完成工作,因为它应该在文本区域。但它不工作,在添加的文本区域点击按钮+过程
-
我需要在使用按钮添加的所有文本区域上自动完成。我该怎么做呢?
-
现在自动完成是区分大小写的。我如何使自动完成发生无论情况?
HTML:<div id="p_procedures"> <textarea rows=5 cols=50> </textarea> </div><a href="#" id="addProcd">+ Procedure</a>
JS:
$('textarea').textcomplete([{
match: /(^|s)(w{2,})$/,
search: function (term, callback) {
var words = ['google', 'facebook', 'GITHUB', 'microsoft', 'yahoo'];
callback($.map(words, function (word) {
return word.indexOf(term) === 0 ? word : null;
}));
},
replace: function (word) {
return word + ' ';
}
}]);
var procdDiv = $('#p_procedures');
var i = $('#p_equipments p').size() + 2;
$('#addProcd').on('click', function(){
var t ='<textarea rows=5 cols=50></textarea>';
$(t).appendTo(procdDiv);
p++;
return false;
});
JSFiddle
添加新元素时:
$(t).appendTo(procdDiv);
初始化自动完成插件将与初始化任何其他元素完全相同:
$(t).textcomplete({ ...options... });
与其复制/粘贴整个初始化,不如将其提取到一个可以在需要时调用的函数中,并将该函数与目标元素一起提供。或者干脆把插件选项放在一个变量中:
var textCompleteOptions = [{
match: /(^|s)(w{2,})$/,
search: function (term, callback) {
var words = ['google', 'facebook', 'GITHUB', 'microsoft', 'yahoo'];
callback($.map(words, function (word) {
return word.indexOf(term) === 0 ? word : null;
}));
},
replace: function (word) {
return word + ' ';
}
}];
然后用这些选项反复调用它:
$('textarea').textcomplete(textCompleteOptions);
后来…
$(t).textcomplete(textCompleteOptions);
关键是,任何时候你想在给定的textarea
上初始化插件,你都需要调用插件初始化器。jQuery不会为你做这些
解决这里区分大小写的问题
search: function (term, callback) {
var words = ['google', 'facebook', 'GITHUB', 'microsoft', 'yahoo'];
callback($.map(words, function (word) {
return word.toLowerCase().indexOf(term.toLowerCase()) === 0 ? word : null;
}));