jQuery .is（）已被点击

我有一系列的列表，当列表项被点击时，列表被分成两部分，并在其间插入一个段落元素。该段落元素根据被点击的列表项目的索引被分配一个类别。jQuery .is（）已被点击

我现在正在试图删除该段落元素，如果列表项目以前被点击过，或者如果段落包含一个与点击项目索引相同的类别。

我似乎无法得到我需要的.is（）方法来解决这个问题。我的选择是相当繁琐的，但这里是我的。是（）方法：

if ($(this).is($(this).parent().parent().children('.'+index))) { 
    alert('li alread clicked'); 
}

http://jsfiddle.net/K4b8J/15/

JS：

$(".category_list.grid li").click(function() { 
    var $uls = $(this).parent().parent().children("ul"); 
    var $lis = $uls.find("li"); 
    // add second list 
    if ($uls.length < 2) { 
     var $newUl = $("<ul></ul>").insertAfter($uls); 
     $uls = $uls.add($newUl); 
    } 

    var index = $lis.index(this); 
    alert(index); 
    //calculate how many lis fit per line 
    var noPerLine = Math.floor($(".category_list.grid").width()/$(".category_list.grid li").outerWidth(true)); 
    //find index at end of line to cut 
    var cutIndex = (Math.ceil((index+1)/noPerLine)*noPerLine)-1; 
    // if last row make index last item 
    if (cutIndex > ($lis.length-1)) { 
     cutIndex = $lis.length-1; 
    } 
    alert(cutIndex); 


    var $following = $lis.slice(cutIndex + 1); // get all following `li` elements 

    // append all li elements up to the current one to the 
    // first list 
    $uls.eq(0).append($lis.slice(0, cutIndex + 1)); 

    if ($following.length > 0) { 
     // append to second list 
     $uls.eq(1).append($following); 
    } else { 
     // remove second list if empty 
     $uls.eq(1).remove(); 
     $uls = $uls.eq(0); 
    } 

    // add a paragraph after the first list 
    $('.preview').remove(); 
    // find if index already clicked 
    if ($(this).is($(this).parent().parent().children('.'+index))) { 
     alert('li alread clicked'); 
    } 

    $('<p />', {'class': 'preview ' + index,text: 'Test'}).insertAfter($uls.eq(0)); 

});

HTML：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript"></script> 
<div class="category_list grid"> 
    <ul> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
    </ul> 
</div> 
<div class="category_list grid"> 
    <ul> 
     <li></li> 
     <li></li> 
    </ul> 
</div> 
<div class="category_list grid"> 
    <ul> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
    </ul> 
</div>

CSS：

*{padding:0;margin:0} 
.preview {clear:both; min-height: 10em; background: red;} 
ul {clear:both;} 
li { 
    width: 5em; 
    height: 3em; 
    background: black; 
    display: inline-block; 
    text-align: left; 
    margin: 1em; 
    color: white; 
} 
.category_list {margin-bottom:2em; clear:both;}

像这样的事情更有意义，但我仍然无法得到它的工作。

if ($(this).parent().siblings('.preview').is('.'+index)) { 
     alert('li already clicked'); 
    }

似乎$(this).parent().siblings('.preview')使某种“.previews'而不是选择从DIV内现有唯一.'preview”的阵列。

好这个工程：

if ($(this).parent().next('.preview').is('.'+index)) { 
     alert('li already clicked'); 
}

来源

2013-02-23 Ryan King

if ($(this).parent().next('.preview').is('.'+index)) { 
     alert('li already clicked'); 
}

作品&的的，如果你删除段落元素之前的说法应该去。 http://jsfiddle.net/K4b8J/19/

来源

2013-02-23 08:15:35

jQuery .is（）已被点击

回答

相关问题