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>");
}
});
};
감사 있어야
contains
의 길이를 확인한다 if 문은 변수가 아닙니다. 다시 한 번 감사드립니다! –
@RodrigoLessa .. 도와 줘서 다행 :) –