jquery中的next()函数没有按预期工作

nzkunb0c 于 2023-06-22 发布在 jQuery

关注(0)|答案(4)|浏览(150)

我知道这是一个重复的问题，但这个问题对我没有帮助，因为我的问题有点不同。
下面是我的html代码：

<select class="selector">
   <option value="volvo">Volvo</option>
   <option value="saab">Saab</option>
   <option value="mercedes">Mercedes</option>
   <option value="audi">Audi</option>
</select>
<div class="show" style="display:none;"></div>

下面是我的jQuery代码：

if($('.selector').val()=="volvo")
   $(this).next('.show').show();

所以，我想要的是，如果<selector>的值为“volvo”，它的下一个div（具有类“show”）将显示，否则不显示。在这里，我没有使用任何change事件。我希望这发生在页面加载后。
我也试过这个：

if($('.selector').val()=="volvo")
   $(this).next().show();

但结果相同，什么也没发生，<div>没有显示。
我现在该怎么办？

jquery

来源：https://stackoverflow.com/questions/24648996/next-function-in-jquery-is-not-working-as-expected

4条答案

按热度按时间

dxxyhpgq1#

类选择器用作.class，类名前面有.。

$('.selector').val()

如果没有事件处理程序，$(this)不能引用select元素，它引用window元素。
使用以下代码，

var $selector = $('.selector');
if($selector.val()=="volvo")
   $selector.next('.show').show();

Demo

赞(0）回复(0）举报 2023-06-22

xesrikrc2#

在您的示例中，this不引用类为selector的元素。它将仅引用window。修改代码如下，

var selector=$('.selector');
if(selector.val()=="volvo")
  selector.next().show();

赞(0）回复(0）举报 2023-06-22

km0tfn4u3#

老兄，没必要这么复杂

HTML

<select class="selector">
   <option value="volvo">Volvo</option>
   <option value="saab">Saab</option>
   <option value="mercedes">Mercedes</option>
   <option value="audi">Audi</option>
</select>
<div class="show" style="display:none;"></div>

JavaScript

$(document).ready(function(){
   if($('.selector').val()=="volvo")){
      $('.show').show();
   }
});

赞(0）回复(0）举报 2023-06-22

cx6n0qe34#

如果没有事件上下文，$(this)就没有意义。此外，这种说法是错误的：

if($('selector').val()=="volvo")

应写成：

if($('.selector').val()=="volvo")

或

if($('select.selector').val()=="volvo")

在这种情况下，您可以这样写：

if($('select.selector').val()=="volvo")
    $('.selector').next('.show').show();

赞(0）回复(0）举报 2023-06-22

我来回答

jquery中的next()函数没有按预期工作

4条答案

相关问题

热门标签

最新问答