JQuery简单添加类不工作

 <div class="newstitle"> 
      <ul class="newstitle"> 
       @foreach (var item in Model.Content) 
       { 
        if (item.Value != null) 
        { 
        <li> 
          <div class="newstitle_title">@item.Key.Name</div> 
         </li> 
        } 
       } 
      </ul> 
    </div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
    $('.newstitle li:nth-child(odd)').addClass('last'); 
}); 
</script>

我有这段代码，我一直在尝试运行，它打破了CSS。
Broken CSS JQuery简单添加类不工作

但是，它应该是像下面，请参阅图像之间的间距：
enter image description here

我是如何解决这一问题？如果你看到div和ul都有相同的类名。

这是生成的html应该是什么：

<div class="newstitle"> 
    <ul class="newstitle"> 
     <li>image</li> 
     <li>image</li> 
     <li>image</li> 
     <li class="last">image</li> 
     <li>image</li> 
     <li>image</li> 
     <li>image</li> 
     <li class="last">image</li> 
     <li>image</li> 
     <li>image</li> 
     <li>image</li> 
     <li class="last">image</li> 
    </ul> 
    </div>

这里是CSS：

.newstitle {width:600px;overflow:hidden;margin:15px auto;} 
.newstitle li {float:left;width:140px;height:170px;overflow:hidden;margin:0px 13px 0px 0px;display:inline;position:relative;} 
.newstitle .last {float:left;width:140px;height:170px;overflow:hidden;margin:0px 0px 0px 0px;display:inline;position:relative;}

来源

2012-05-08 DarthVader

你需要更好的类名。 – JakeParis

试试这个：

$('li', 'ul.newstitle').filter(function() {return $(this).index()%4===0}).addClass('last');

FIDDLE

来源

2012-05-08 02:22:11 adeneo

而'.last'应该做的css也会有帮助。 – JakeParis

这让新行 – DarthVader

@JMCCreative - 是可以，但我猜想这是多为图像之间设置余量，但什么样的图像，所有我看到的是一些非渲染模式？ – adeneo

怎么样小号omething这样

<script type="text/javascript"> 
    $(document).ready(function() { 
     var $li = $('ul.newstitle li'), 
      y = 0; 
     for (var i=0, n = $li.length; i < n; i++) { 
      if (y++ === 3) { 
       $($li[i]).addClass("last"); 
       y = 0; 
      } 
     } 
    }); 
</script>

希望它能有助于

来源

2012-05-08 02:45:31

JQuery简单添加类不工作

回答

相关问题