2013-10-23 3 views
0

골드를 클릭하면 하나의 요소로만 구성되며, 실버 또는 무제한을 클릭하고 표시된 요소를 클릭 한 이전 요소를 제거하십시오. Lenovo 다운로드 사이트 드라이버와 같습니다.형제들은 어떻게 요소를 제거 할 수 있습니까?

jsfiddle code

youtube video

$(function() { 

     var groupTypes = null; 

     var count = 0; 

     $.getJSON('/api/Groups', null, function (data) { 
      groupTypes = data; 
      var $list = $('<ol id="selectable" />'); 

      $.each(groupTypes, function (i, groupType) { 
       var $li = $('<li />'); 
       $li 
        .addClass('ui-widget-content') 
        .attr('data-index', i) 
        .html(groupType.Name); 

       $list.append($li); 

       $li.on('click', function() { 
        count++; 
        var index = $(this).attr('data-index'); 
        $(this).parent().find('li').removeClass('ui-selected'); 
        $(this).addClass('ui-selected'); 

        var speeds = groupTypes[index].GroupSpeeds; 
        console.log(speeds); 
        var $speedList = $('<ol id="selectable" />'); 
        $.each(speeds, function (i, speed) { 
         if (speed) { 
          var $speedLi = $('<li />'); 
          $speedLi 
           .addClass('ui-widget-content') 
           .attr('data-index', i) 
           .html(speed.Speed); 

          $speedList.append($speedLi); 
          $(this).parent('#container').nextAll().remove(); 

         } 
        }); 

        $('body').append($speedList); 
       }); 
      }); 

      $('#container').append($list); 
     }); 
+0

무엇이 질문 : –

+0

제공 jsFiddle이 작동하지 않습니다 –

답변

2

그냥 당신이

$speedLi.addClass('speed') 

를 추가하고 더 많은

$('.speed').remove() 
를 추가하기 전에 다음 제거 요소에 대한 특별 클래스를 추가

피들 http://jsfiddle.net/vgPkU/

+1

+1 나와 같은 결과를 얻었습니다 http://jsfiddle.net/vBF3T/2/ 다른 대답은 필요 없음 =) – MackieeE

관련 문제