1

我正在尝试修改此 jQuery 插件，我想限制从文本框中选择后显示在文本框中的总元素。我目前正在将所选项目移动到仅当您单击链接时才可见的 div。

这就是我所取得的成就：

在此处输入图像描述

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 个项目将显示在文本框中
  2. 所有其他选定的项目将被移动到一个隐藏的 div，当你点击显示所有选定的 div 变得可见，我们可以取消选择项目。
  3. 取消选择项目后，它们必须在下拉列表中重新填充。
4

0 回答 0