2011-09-14 83 views
3

我有一種情況,即通過自定義CMS中的博客文章列表進行排序。每篇博文均包含在<li>中,頁面上有多個帖子。我的代碼放在每個博客文章的共享按鈕上。不幸的是,博客文章的所有類名都以「post」開頭。例如;在末尾選擇具有唯一編號的屬性

<div class="blogList"> 
    <ul> 
      <li class="post1"> 
       <h2 class="postTitle">A Sample Title</h2> 
       <div class="postDescription">Some sample content</div> 
      </li> 

      <li class="post2"> 
       <h2 class="postTitle">A Sample Title</h2> 
       <div class="postDescription">Some sample content</div> 
      </li> 
    </ul> 
</div> 

我是通過這個排序與李的「每個」,但最終將它添加到包含在任何帖子內容本身的列表。所以我只想將這一次添加到每個博客文章的實際父項目li上。

我想要做的只是將它添加到<li>與一類「後」,然後一個數字。我不能只查找帖子,因爲它也會將它添加到任何其他具有「發佈」類別的項目中,因爲它是起始名稱。

如何僅選擇僅包含「帖子」類和數字的元素?所以我想在li.post1,li.post2的上面例子中只找到元素。所有其他元素將被跳過。

我在jquery中這樣做,我覺得我很接近,但似乎無法克服這個駝峯。

下面是我正在使用的代碼示例。

<script type="text/javascript"> 
    $(document).ready(function(){ 

     //Run through the page and find each individual blog post 
     $('.blogList li [class^="post"]').each(function() { 

      //Grab post title & encode any quotes so they don't mess up generated HTML 
      var postTitle = $.trim($(this).children(".postTitle").text().replace('"g, "')); 

      //Grab URL from the anchor element inside the h2 element (will not grab correct link in admin mode) 
      var postLink = location.protocol + '//' + location.host + $(this).children("h2").find("a[href]").attr('href'); 

      //Add "share this" HTML elements to the bottom of the post 
      $(this).append(
       '<div class="st">' + 
        '<span class="st_twitter" displayText="Tweet" st_url="' + postLink + '" st_title="' + postTitle + '"></span>' + 
        '<span class="st_facebook" displayText="Facebook" st_url="' + postLink + '" st_title="' + postTitle + '"></span>' + 
        '<span class="st_linkedin" displayText="LinkedIn" st_url="' + postLink + '" st_title="' + postTitle + '"></span>' + 
        '<span class="st_email" displayText="Email" st_url="' + postLink + '" st_title="' + postTitle + '"></span>' + 
        '<span class="st_blogger" displayText="Blogger" st_url="' + postLink + '" st_title="' + postTitle + '"></span>' + 
        '<span class="st_sharethis" displayText="ShareThis" st_url="' + postLink + '" st_title="' + postTitle + '"></span>' + 
       '</div>' 
      ); 
     }); 
    }); 
</script> 

回答

3

你只需要使用更具體的類選擇器。此規則應該得到你所需要的:

$('div.blogList>ul>li[class^="post"]') 

,將讓你只能直接子裏的一類職位*的是一個UL是與類blogList的一個div的直接孩子的直接孩子。