Question

我有像

这样的HTML

 <ul>
    <li>one</li>
    <li>two</li>
    <li>tree</li>
 </ul>

现在每个＆＃39; li的ng-click element我想添加课程active并从其他地方删除＆＃39; li＆＃39;元素。此外，如果相同的＆＃39; li＆＃39;再次点击，然后我想删除课程＆＃39;活跃＆＃39;

Answer 1

更改您的HTML

#navigation ul {
width: 900px;
margin: 0 auto;
list-style:None;
}

#navigation li {
display: inline-block;
padding: 0px 50px 0px 20px;
list-style:None;
vertical-align: super;
font-size: 20px;
color: #000;
text-align:center;
}

#navigation li a {
font-size: 9px;
    text-transform:uppercase;
    letter-spacing:1px;
    display:block;
    position:relative;
margin-bottom:-8px;
letter-spacing:2px;
color:#000;
}

#navigation li a:after {
  content: '';
  display: block;
  border-bottom: 2px solid;
  border-color: inherit;
  width: 0;
  position: absolute;
  left: 0;
  -webkit-transition: 0.6s ease;
  transition: 0.6s ease;
}

#navigation li a:hover:after { 
  width: 100%; 
}

并添加新功能

var arrColor=['#ff86b1', '#d162ff', '#9cbdff', '#4fff4f'];

var randIdx=parseInt(Math.random()*arrColor.length);

$('#navigation li a').css('border-color',arrColor[randIdx]);
console.log(arrColor[randIdx]);

告诉工作fiddle

在＆gt; li＆gt;上添加/删除课程点击angularjs

1 个答案: