自定义选择的jQuery插件

时间:2013-08-05 06:20:50

标签: jquery jquery-chosen

我正在尝试修改this jQuery plugin,我希望在从文本框中选择后限制文本框中显示的总元素。我目前正在将所选项目移动到div,只有当您点击链接时才能看到该div。

这就是我所获得的:

enter image description here

countCities++; if(countCities > 2){
    gonningToAppend = $('ul.chzn-choices li:visible').first().attr('id');
    cityName = $('ul.chzn-choices li:visible span').first().html();
    //alert(cityName);
    $('#invisibleCityContainer').append('<div class="'+gonningToAppend+' search-choice-todel'+'"><div style="display:inline-block;">'+cityName+'</div></div>');
    $('#invisibleCityContainer').append('<div id="'+gonningToAppend+'_close" class="x_button_for_city_list" ></div>');
    //$('ul.chzn-choices li:visible').first().appendTo("#invisibleCityContainer");
    $('ul.chzn-choices li:visible').first().hide();     

    $('#pluseCityCountInProfilePageEdit').html('and '+(countCities-2)+' more.');

  }
$( "#pluseCityCountInProfilePageEdit" ).click(function() { 
    $("#invisibleCityContainer").animate( { "opacity": "show"} , 1000 );
    event.stopPropagation();
}
);

HTML

<div id="invisibleCityContainer" style="display:none;" ></div>

我想要实现的目标:

  1. 如果您选择两个以上的项目,则会在文本框中显示最新的两个项目
  2. 当您点击显示全部选中时,所有其他所选项目将被移动到隐藏的div div变得可见,我们可以取消选择项目。
  3. 取消选择项目后,他们必须在下拉列表中重新填充。

0 个答案:

没有答案