寻找一个关于如何检测li是否有孩子ul或者ol的解决方案我发现jquerys has()除了我需要检测实际点击的li是否有孩子ol之外是非常棒的任何兄弟姐妹。有没有办法做到这一点?文档没有涵盖这一点。
HTML
<ol>
<li><a class="delete-li" href="">Page 1</a></li>
<li><a class="delete-li" href="">Page 2</a></li>
<li><a class="delete-li" href="">Page 3 has ol</a>
<ol>
<li><a class="delete-li" href="">Page 4</a></li>
<li><a class="delete-li" href="">Page 5</a></li>
<li><a class="delete-li" href="">Page 6</a></li>
</ol>
</li>
</ol>
JS
$('.delete-li').live('click', function(event){
event.preventDefault();
item_id = $(this).attr('rel');
clicked = $(this);
////////////////////
//check if has sub pages
if(clicked.has('ol')){
answer = confirm('This will delete all sub pages and content are you sure?');
console.log(answer);
if(answer===true){gogogo=true;
}else{gogogo=false;}
}else{ gogogo=true;}
//if yes run AJAX delete
if(gogogo===true){
alert('LI REMOVED');
}
////////////////
});
检查jsfiddle代码。
答案 0 :(得分:5)
has
返回一个始终为true
的jQuery对象,因为您的处理程序绑定到a
元素,您可以使用next
方法和length
属性:
if ( clicked.next('ol').length )
请注意,live
方法已弃用,您可以使用on
方法。
$(document).on('click', '.delete-li', function (event) {
event.preventDefault();
var gogogo = false, $clicked = $(this), item_id = this.rel;
////////////////////
//check if has sub pages
if ($clicked.next('ol').length) {
gogogo = confirm('This will delete all sub pages and content are you sure?');
// console.log(gogogo);
}
if (gogogo === true) {
alert('LI REMOVED');
}
});
答案 1 :(得分:1)
您将点击处理程序绑定到a
元素。您需要参考li
。
listItem = $(this).parent('li');
//check if has sub pages
if (listItem.find('ol').length) {
...
}
答案 2 :(得分:0)
您正在调用<a>
标记上的函数,该标记没有子标记。如果你想要深入了解,你需要从他的父母<li>
中引用。
$('.delete-li').on('click', function (event) {
event.preventDefault();
$this = $(this);
if ($this.parent('li').children('ol').length) {
answer = confirm('This will delete all sub pages and content are you sure?');
alert(answer);
} else {
alert('dont');
}
});