我想选择在我的元素中使用 jQuery 单击的特定 li。当我单击一个 li 时，它会选择所有 li。这是我的 fiddle 。我只是一个初学者。我试过使用 parent()，但它不起作用。
JS FIDDLE
这是我的 HTML:
var clicks = 0;
$("li").on("click", function () {
clicks++;
$('.top-right').html(clicks);
});.list li {
list-style-type: none;
display: inline-block;
background-color: white;
margin-right: 7px;
}
.list {
margin: 5px;
}
.list li a {
text-decoration: none;
color: black;
padding: 2px;
}
.list li a:hover,
.list li a:hover {
color: black;
}<!DOCTYPE html>
<html>
<head>
<title>Exam</title>
</head>
<body>
<div class="list">
<ul>
<li>
<a href="#">NAME
<span class="line"></span> AWONUSI OLAJIDE</a>
<span class="top-right"></span>
</li>
<li>
<a href="#">NAME
<span class="line"></span> ADEGBULUGBE TIMILEHIN</a>
<span class="top-right"></span>
</li>
<li>
<a href="#">NAME
<span class="line"></span> OLUOLU ADEDEJI</a>
<span class="top-right">9999</span>
</li>
<li>
<a href="#">NAME
<span class="line"></span> OYAJE JOSHUA</a>
<span class="top-right">9999</span>
</li>
<li>
<a href="#">NAME
<span class="line"></span> ALABI OJO ADE</a>
<span class="top-right">9999</span>
</li>
<li>
<a href="#">NAME
<span class="line"></span> AKILO AWANI</a>
<span class="top-right">9999</span>
</li>
<li>
<a href="#">NAME
<span class="line"></span> AYUBA DEJIMARK</a>
<span class="top-right">9999</span>
</li>
</ul>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
</body>
</html>最佳答案
您需要使用.find() 来获取被点击元素内的元素。此外，您需要显示的值比其中已经存在的值多 1。
$("li").on("click", function() {
$(this).find('.top-right').html(function(){
return +$(this).html() + 1
});
});
$("li").on("click", function() {
$(this).find('.top-right').html(function(){
return +$(this).html() + 1
});
});.list li {
list-style-type: none;
display: inline-block;
background-color: white;
margin-right: 7px;
}
.list {
margin: 5px;
}
.list li a {
text-decoration: none;
color: black;
padding: 2px;
}
.list li a:hover,
.list li a:hover {
color: black;
}<!DOCTYPE html>
<html>
<head>
<title>Exam</title>
</head>
<body>
<div class="list">
<ul>
<li><a href="#">NAME <span class="line"></span> AWONUSI OLAJIDE</a><span class="top-right"></span></li>
<li><a href="#">NAME <span class="line"></span> ADEGBULUGBE TIMILEHIN</a><span class="top-right"></span></li>
<li><a href="#">NAME <span class="line"></span> OLUOLU ADEDEJI</a><span class="top-right">9999</span></li>
<li><a href="#">NAME <span class="line"></span> OYAJE JOSHUA</a><span class="top-right">9999</span></li>
<li><a href="#">NAME <span class="line"></span> ALABI OJO ADE</a><span class="top-right">9999</span></li>
<li><a href="#">NAME <span class="line"></span> AKILO AWANI</a><span class="top-right">9999</span></li>
<li><a href="#">NAME <span class="line"></span> AYUBA DEJIMARK</a><span class="top-right">9999</span></li>
</ul>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
</body>
</html>关于javascript - 仅选择特定的点击，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49174656/