如何根据使用jQuery内部的文本将类添加到“ li”元素中

Question

var id值动态变化。如何使用相同的文本将class='current'添加到列表中。例如，当id=1，

<li class="current"><a href="http://localhost/myweb/index.php/blog/index">1</a></li>

我尝试过但不起作用。

<ul class='pagination'>
<li>&lt;</li>
<li><a href="http://localhost/myweb/index.php/blog/index">1</a></li>
<li><a href="http://localhost/myweb/index.php/blog/index/2">2</a></li>
<li><a href="http://localhost/myweb/index.php/blog/index/3">3</a></li>
<li><a href="http://localhost/myweb/index.php/blog/index/2">&gt;</a></li>
</ul>
<script>
$(window).load(function() {
    var id = 1;
    $('.pagination ul li').each(function(){
        if($this.val() == id)
        {
            $this.addClass("current");
        }
    });
});
</script>

Answer 1

您有以下三个问题

1. 您将选择器作为$('.pagination ul li')，这是错误的，并且它应该是$('.pagination li')或$('ul.pagination li')
2. 您在两个地方使用了$this，而不是$(this)
3. 为了比较值，您应该使用$(this).find('a').text()而不是$this.val()，因为您需要在 anchor标签

工作样本

.current {
  background-color: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class='pagination'>
<li></li>
<li><a href="http://localhost/myweb/index.php/blog/index">1</a></li>
<li><a href="http://localhost/myweb/index.php/blog/index/2">2</a></li>
<li><a href="http://localhost/myweb/index.php/blog/index/3">3</a></li>
<li><a href="http://localhost/myweb/index.php/blog/index/4">4</a></li>
</ul>
<script>
$(window).load(function() {
    var id = 1;
    $('ul.pagination li').each(function(){
        if($(this).find('a').text() == id)
        {
            $(this).addClass("current");
        }
    });
});
</script>