2013-08-06 4 views
1

나는 재생 목록을 구성하기 위해 다른 ul에 추가 할 수있는 노래 묶음이있는 ul이 있습니다. 그러나 나는 같은 노래가 두 번 나는 JQuery와 통해이 일을하고있어 추가 싶지 않아하지만 난 여기에 원하는 결과를 얻을 수없는 http://jsfiddle.net/mcaJS/ 여기 내 코드입니다 :재생 목록에 중복을 추가하지 않았습니다.

HTML

<h1>Playlist Mania</h1> 

<form> 
    <input type="text" id="containsContent"> 
    <input type="button" value="Filter" id="filterButton"> 
    <input type="button" value="Add to Playlist" id="addButton"> 
    <input type="button" value="Clear" id="clearButton"> 

<h2>Selected Songs</h2> 

    <ul id="playlist"></ul> 

<h2>Albums to choose from</h2> 

    <div class="album"> 
     <h3>The Dark Side of the Moon</h3> 

     <h4>Pink Floyd</h4> 

     <ol> 
      <li> 
       <input type="checkbox"><a href="http://en.wikipedia.org/wiki/Speak_to_Me" data- length="1:30">Speak to Me</a> 
      </li> 
      <li> 
       <input type="checkbox"><a href="http://en.wikipedia.org/wiki/Breathe_(Pink_Floyd_song)" data- length="2:43">Breathe</a> 
      </li> 
      <li> 
       <input type="checkbox"><a data-length="3:36">On the Run</a> 
      </li> 
      <li> 
       <input type="checkbox"><a data-length="7:01">Time</a> 
      </li> 
      <li> 
       <input type="checkbox"><a href="http://en.wikipedia.org/wiki/The_Great_Gig_in_the_Sky" data-length="4:36">The Great Gig in the Sky</a> 
      </li> 
      <li> 
       <input type="checkbox"><a data-length="6:22">Money</a> 
      </li> 
      <li> 
       <input type="checkbox"><a data-length="7:46">Us and Them</a> 
      </li> 
      <li> 
       <input type="checkbox"><a data-length="3:25">Any Colour You Like</a> 
      </li> 
      <li> 
       <input type="checkbox"><a href="http://en.wikipedia.org/wiki/Brain_Damage_(song)" data-length="3:48">Brain Damage</a> 
      </li> 
      <li> 
       <input type="checkbox"><a data-length="2:03">Eclipse</a> 
      </li> 
      <ol> 
    </div> 
</form> 
</body> 

</html> 

JS

$("document").ready(function() { 
    $("input#filterButton").click(filterContentAndCheck); 
    $("input#clearButton").click(clearAll); 
    $("input#addButton").click(addToPlaylist); 
}); 
var clearAll = function() { 
    $("*").removeClass("highlight"); 
    $("form").get(0).reset(); 
    $("form input:checked").attr("checked", false); 
}; 
var filterContentAndCheck = function() { 
    var lookFor = $("input#containsContent").val(); 
    clearAll(); 
    $("li a:contains('" + lookFor + "')").parent().addClass("highlight"); 
    $("li.highlight input:checkbox").attr("checked", true); 
}; 

var addToPlaylist = function() { 
    $("form input:checked").parent().each(function() { 
     var song = $(this).text(); 
     var contains = $("ul#playlist li:contains()"); 
     console.log(contains); 
     if (contains > 0) { 
      alert("do not add"); 
     } else { 
      $("ul#playlist").append("<li>" + song + "</li>"); 
     } 
    }); 
}; 

답변

0
var contains = $("ul#playlist li:contains()"); 

ㄴ하는데 e

var contains = $("ul#playlist li:contains(" + song + ")"); 

그렇지 않으면 배열을 가지고 재생 목록에 추가 할 때 노래를 누를 수 있습니다. 그리고 배열을 먼저 확인한 다음 재생 목록에 추가하십시오.

그리고 당신의 조건은 내가 .length를 (추가 된 작정 (가) 포함에)

if (contains.length > 0) { 

Check Fiddle

+0

감사 있어야 contains

if (contains> 0) { 

의 길이를 확인한다 if 문은 변수가 아닙니다. 다시 한 번 감사드립니다! –

+0

@RodrigoLessa .. 도와 줘서 다행 :) –

관련 문제