问题描述
我使用jQuery UI的自动完成,我试图限制多个结果。基本上我建我使用的是自动完成的调遣PM系统。但我试图限制人们单个邮件可以发送到的金额。所以像限制最多选择25。
有什么办法来限制呢?他们已经达到最大的视觉指示器还什么想法?
选择:函数(事件,UI){
VAR而言=拆分(THIS.VALUE);
如果(terms.length&下; = 2)
{
//删除当前输入
terms.pop();
//添加所选项目
terms.push(ui.item.value);
//添加占位符来获得在最后逗号和空格
terms.push();
THIS.VALUE = terms.join(,);
返回false;
}
其他
{
$(本).effect(亮点,{},1000);
$(本).addClass(红);
$(#警告)HTML(<跨度风格=颜色:红色;'>最多达人< / SPAN>中)。
返回false;
}
}
这可以很容易地真正聆听的的。您可以通过并去除类自动完成制作,例如红色。我想你可以用这样的一点点努力完成自己。
选择:函数(事件,UI){
VAR而言=拆分(THIS.VALUE);
如果(terms.length&下; = 2){
//删除当前输入
terms.pop();
//添加所选项目
terms.push(ui.item.value);
//添加占位符来获得在最后逗号和空格
terms.push();
THIS.VALUE = terms.join(,);
返回false;
}其他{
VAR最后= terms.pop();
$(本).VAL(this.value.substr(0,this.value.length - last.length - 2)); //将删除输入文本
$(本).effect(亮点,{},1000);
$(本).addClass(红);
$(#警告)HTML(<跨度风格=颜色:红色;'>最多达人< / SPAN>中)。
返回false;
}
}
PS我也觉得这些插件之一可能是合适的感谢:
-
看起来在我看来,漂亮的:
点击链接查看。
-
http://net.tutsplus.com/tutorials/javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget/
I am using the jQuery UI autocomplete and I am attempting to limit the multiple results. Basically I'm building a PM system I am using the autocomplete for the to field. But I'm trying to limit the amount of people a single message can be sent to. So like limit the max selections to 25.
Is there any way to limit this? Also any ideas on a visual indicator that they have reached the max?
select: function( event, ui){
var terms = split( this.value );
if(terms.length <= 2)
{
// remove the current input
terms.pop();
// add the selected item
terms.push( ui.item.value );
// add placeholder to get the comma-and-space at the end
terms.push( "" );
this.value = terms.join( ", " );
return false;
}
else
{
$(this).effect("highlight", {}, 1000);
$(this).addClass("red");
$("#warnings").html("<span style='color:red;'>Max people reached</span>");
return false;
}
}
That can be achieved real easily by listening events. You could make the color red for example by adding class and removing class to autocomplete. I think you can accomplish this yourself with a little bit of effort.
select: function( event, ui ) {
var terms = split( this.value );
if(terms.length <= 2) {
// remove the current input
terms.pop();
// add the selected item
terms.push( ui.item.value );
// add placeholder to get the comma-and-space at the end
terms.push( "" );
this.value = terms.join( ", " );
return false;
} else {
var last = terms.pop();
$(this).val(this.value.substr(0, this.value.length - last.length - 2)); // removes text from input
$(this).effect("highlight", {}, 1000);
$(this).addClass("red");
$("#warnings").html("<span style='color:red;'>Max people reached</span>");
return false;
}
}
P.S I also think one of these plugins could be suitable thanks to google:
https://github.com/loopj/jQuery-Tokenizing-Autocomplete-Plugin
Looks nice in my opinion:
Click link to view live demo.
http://net.tutsplus.com/tutorials/javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget/
- Facebook style JQuery autocomplete plugin
这篇关于jQueryUI的自动完成极限多种选择的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!