我正在尝试获取每个列表中的列表大小,因为有多个列表,每个列表都是动态添加的。它似乎没有返回正确的数字,不确定原因。
计数应返回每个部分的列表项数
还有一个小提琴:http://jsfiddle.net/Dqf8B/
<section id="questionOne">
<span class="surveyQuestion"></span>
<form>
<input>
<a class="button">Add</a>
</form>
<p class="helperText">drag to prioritize</p>
<ol class="draggable answers">
</ol>
</section>
<section id="questionTwo">
<span class="surveyQuestion"></span>
<form>
<input>
<a class="button">Add</a>
</form>
<p class="helperText">drag to prioritize</p>
<ol class="draggable answers">
</ol>
</section>
function checkIfHelperIsNeeded(counter) {
if(counter == 2){
helperText.slideToggle(function(){
$(this).fadeIn();
})
if (counter < 2) { helperText.hide(); };
}
}
$('.button').each(function(){
var counter = $(this).parent("form").parent("section").find("ol").size();
console.log(counter);
$(this).click( function(){
if(counter <= 5) {
checkIfHelperIsNeeded(counter);
var myCurrentInputTags = $(this).parent('form').children('input').val();
var li = $('<li class="tag">'+myCurrentInputTags+'</li>');
$('<span class="close"></span>').on('click', removeParent).prependTo(li);
$(this).parent('form').parent('section').children('.draggable').prepend(li);
} else { alert("only 5 answers per question allowed")}
});
})
function removeParent() {
$(this).parent().fadeOut( function() {
$(this).remove();
});
}
var helperText = $(".helperText");
helperText.hide();
答案 0 :(得分:0)
目前,当此脚本首次加载时,您似乎只运行each()
函数。因此,您不应期望它能够获取对DOM动态进行的任何更改。
然后设置一个onclick函数来比较counter
值(它始终是最后一个按钮的最后一个计算值),而不是可能是不同的按钮。因此,在each()
运行counter
之后,click()
具有一个静态值,在ol
期间将对所有按钮进行比较。我猜这不是你想要的。
你应该只计算click()
函数中counter
选项的大小,因为你使用这个{{1}}变量实际上没有任何收获。