我正在尝试找到显示为display: block的最后一个div，以便可以向该div添加border-bottom。您可以使用this JSFiddle查看原因
尝试在文本框中输入“ Dan”或“ Alfredo”以获取问题的示例。
<!doctype html>
<html ng-app>
<head>
<style>
body {
margin: 0px;
font-family: Helvetica, sans-serif;
}
#customers {
margin-top: 20px;
width: 300px;
margin-right: auto;
margin-left: auto;
}
#nameSearch {
width: 300px;
outline: none;
height: 30px;
font-size: 17px;
text-align: center;
border: 1px solid black;
margin: 0;
padding: 0;
}
.cust-info > p {
margin: 0px;
line-height: 35px;
}
.cust-info {
text-align: center;
height: 30px;
width: 300px;
border-top: 1px solid black;
border-right: 1px solid black;
border-left: 1px solid black;
display: none;
}
#search-result {
width: 301px;
height: 124px;
}
.cust-info:nth-child(1),
.cust-info:nth-child(2),
.cust-info:nth-child(3),
.cust-info:nth-child(4){
display: block;
}
.cust-info:nth-child(1) {
border-top: 0px solid white;
}
.cust-info:nth-child(4) {
border-bottom: 1px solid black;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body ng-init="customers=[{name:'Roemer Blom', city:'Utrecht'}, {name:'Peter Rusell', city:'Amsterdam'}, {name:'John deere', city:'Den Haag'}, {name:'Richard Kowinski', city:'Leiden'}, {name:'John Silver', city:'Delft'}, {name:'Dan Aniston', city:'Leiden'}, {name:'Alfredo Querida', city:'Mexico-Stad'}, {name:'Dani Alves', city:'New York'}, {name:'Harvey Cook', city:'New York'}, {name:'Mike Ross', city:'Texas'}, {name:'Michelle Donalds', city:'Neimegen'}, {name:'Cathy Treys', city:'Nieuwegein'}, {name:'Lucy O\'Neil', city:'Nevada'}, {name:'Patrick Blom', city:'Utrecht'}, {name:'Coco Chanel', city:'Amsterdam'}, {name:'Jimi Hendrix', city:'Den Haag'}, {name:'Steve Jobs', city:'Leiden'}, {name:'Susane Boyle', city:'Delft'}, {name:'George Bush', city:'Leiden'}, {name:'Susie Waters', city:'Mexico-Stad'}, {name:'Dan Perkins', city:'New York'}, {name:'Mitchel Green', city:'New York'}, {name:'Leroy Fericho', city:'Long Island'}, {name:'Gus McGregor', city:'Neimegen'}, {name:'Ronnie Sullivan', city:'Nieuwegein'}, {name:'Vivian Sherbert', city:'Nevada'}]">
<div id="customers">
Name:
<br>
<input type="text" id="nameSearch" ng-model="name">
<div id="search-result">
<div class="cust-info" ng-repeat="cust in customers | filter:name | orderBy:'name'">
<p>{{ cust.name }} - {{ cust.city }}</p>
</div>
</div>
</div>
</body>
</html>
最佳答案
您可以使用CSS来实现
.cust-info:last-child {
border-bottom: 1px solid black;
}