2012-03-14 1 views
5

Я хочу применить некоторые свойства css в последнем tr в таблице, поэтому у меня есть использование: последний селектор, но он не будет работать в ie9 ниже версии, поэтому я пытаюсь сделать это с помощью метода «eq()», но не получаю результата. В jquery можно настроить последний tr с помощью метода eq().Как настроить last tr в jquery?

<script type="text/javascript" src="../jquery/jquery-1.7.min.js"></script> 

<script type="text/javascript"> 

$(function() { 

    var trNo= $('#compareTable tr'); 
    var NoN= trNo.eq(-1); 
    NoN.css('border','none') 
    }); 


</script> 

</head> 

<body> 
<div class="main"> 

<div class="compatible"> 
<h4 class="compatileHeading">8 Matching Compatible Product</h4> 
<div class="listingCompatibleProdcut"> 
<table width="100%" border="0" cellspacing="0" cellpadding="0" id="compareTable"> 
    <tr> 
    <td width="105" align="center"> 
    <div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 

    </ul> 
    </div> 
    </td> 
    <td width="105" align="center"><div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 


    </ul> 
    </div></td> 
    <td width="105" align="center"><div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 


    </ul> 
    </div></td> 
    <td width="105" align="center"><div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 


    </ul> 
    </div></td> 
    </tr> 
    <tr> 
    <td width="105" align="center"> 
    <div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 


    </ul> 
    </div> 
    </td> 
    <td width="105" align="center"><div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 


    </ul> 
    </div></td> 
    <td width="105" align="center"><div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 


    </ul> 
    </div></td> 
    <td width="105" align="center"><div class="compareBox"> 
    <ul id="compareunorderedList"> 
    <li class="compareImg"><img src="images/img.jpg" width="50" height="93" /></li> 
    <li class="compareTitle">Galaxy S LCD 4GB</li> 
    <li class="compareCode">GT-19003</li> 


    </ul> 
    </div></td> 
    </tr> 
</table> 



</div> 

</div> 

</div> 

ответ

12
$(function() { 
    $('#compareTable tr').last().css('border', '0'); 
}); 

или

$(function() { 
    $('#compareTable tr:last-child').css('border', '0'); 
}); 

демо:

http://jsfiddle.net/edLev/

+0

Не работает в ie, даже я использовал метод eq(), но он также не работает в ie – Carlos

+2

Точно. У 'tr' нет границы. Вы можете рисовать только границы вокруг всей таблицы или отдельных ячеек. И это не проблема IE –

+0

@amit Теперь я снова прочитал вопрос, у меня возникают сомнения в том, что вы пытаетесь сделать. С начала границы нет границ (вы явно указываете 'border =" 0 "'), поэтому 'border: none' не будет иметь никакого эффекта, даже если это сработает. –

0

Самый простой способ я могу думать:

$("#compareTable tr:last-child") 
2

JQuery реализует :last selector, так что это должно работать:

$('#compareTable tr:last') 

// or, for better performance 

$('#compareTable tr').filter(':last') 

Сказав, что .eq(-1) должен работать тоже ...

EDIT: Я просто попытался :last и .eq(-1) с вашим html и оба отлично работали как в Chrome, так и в IE.