做出的第一个元素风格的时候下一个元素被点击

Question

被删除

这question回答了什么是我想要的，只是做第一次加载页面时，我不能得到的第一个元素的结果，把它移除时的部分第二个元素被点击。

<li><a href="#">first element</a></li> 
<li><a href="#">second element</a></li> 
<li><a href="#">third element</a></li> 

li a { 
    border: 1px solid blue 
} 
.selected { 
    border-color: red 
} 

当第一次加载页面，第一个元素是不是点击，我想让它显示红色的边框颜色（选择），但被点击第二元素时，红色应该是换成蓝色。

Answer 1

只需添加：

$(function() { 
    var $lia = $('li').find('a'); 

    $lia.click(function(e) { 
    $lia.removeClass('selected'); 
    $(this).addClass('selected'); 
    }); 

    $lia.first().addClass('selected'); 
}); 

Here's an example!

Answer 2

HTML：

<ul class="options"> 
<li class="selected"><a href="#">first element</a></li> 
<li><a href="#">second element</a></li> 
<li><a href="#">third element</a></li> 
</ul>  

的JavaScript：

$(function() { 
     $('ul.options').delegate('li a', 'click', function() { 
      $('li.selected').removeClass('selected'); 
      $(this).addClass('selected'); 
     }); 
    }); 

你并不需要将类添加到他第一要素w^ith JavaScript它在页面加载时总是在那里，并且如果动态添加新的li，这也将起作用。