Fatal编程技术网
  • jquery/
  • Jquery 隐藏功能不工作

Jquery 隐藏功能不工作

jquery

Jquery 隐藏功能不工作,jquery,Jquery,我有简单的隐藏和显示功能，但它不工作。任何帮助都将不胜感激 <head> <script type="text/javascript"> $(function(){ $('a').click(function(){ var visible= false; if(visible){ $('div').hide('slow') } else { $('div').show('slow') } visible=!v

我有简单的隐藏和显示功能，但它不工作。任何帮助都将不胜感激

<head>
<script type="text/javascript">
$(function(){
$('a').click(function(){
var visible= false;         
if(visible){
$('div').hide('slow')           
}

else {
$('div').show('slow')           
}
visible=!visible;
})
})
</script>
</head>
<body>
<div style="background:#F00; width:500px; height:50px"></div>
<a href="#">hide</a>
<div class="append"></div>
</body>


$（函数（）{
$（'a'）。单击（函数（）{
可见值=假；
如果（可见）{
$（'div'）.hide（'slow'））
}
否则{
$（'div'）.show（'slow'））
}
可见=！可见；
})
})
问题在于以下几行：

var visible= false;         
if(visible){
    $('div').hide('slow')           
}

visible
在此上下文中始终为false，因此您的div将永远不会被隐藏。

问题在于以下几行：

var visible= false;         
if(visible){
    $('div').hide('slow')           
}

visible
在此上下文中始终为false，因此您的div永远不会被隐藏。

在事件处理程序外部声明并初始化
visible
：

var visible= false;  
$('a').click(function(){
   if(visible){
       $('div').hide('slow')           
   }
   else {
       $('div').show('slow')           
   }
   visible=!visible;
});
否则，每次执行事件处理程序时，您都会使用
false
初始化
visible
，因此
if（visible）
将永远不会为true

但是，您也可以使用以避免使用其他状态变量：

$('a').click(function(){
    $('div').toggle();         
});
在事件处理程序外部声明并初始化可见的
：


var visible= false;  
$('a').click(function(){
   if(visible){
       $('div').hide('slow')           
   }
   else {
       $('div').show('slow')           
   }
   visible=!visible;
});


否则，每次执行事件处理程序时，您都会使用
false
初始化
visible
，因此
if（visible）
将永远不会为true

但是，您也可以使用以避免使用其他状态变量：


$('a').click(function(){
    $('div').toggle();         
});



jQuery有一个内置的隐藏/显示方法：。它在隐藏元素时显示元素，反之亦然
 jQuery有一个内置的隐藏/显示方法：。它在隐藏元素时显示元素，反之亦然
 尝试使用
切换
。在这里查看第二个示例：



下面是一个例子：


<!DOCTYPE html>
<html>
<head>
  <style>
    p { background:#dad;
        font-weight:bold;
        font-size:16px;
    }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <button>Toggle 'em</button>

  <p>Hiya</p>
  <p>Such interesting text, eh?</p>
  <script>
    $("button").click(function () {
      $("p").toggle("slow");
    });    
  </script>

</body>
</html>




背景：爸爸；
字体大小：粗体；
字体大小：16px；
}
切换它们
你好

这么有趣的文字，嗯

$（“按钮”）。单击（函数（）{
$（“p”）。切换（“慢速”）；
});    

尝试改用
切换。在这里查看第二个示例：



下面是一个例子：


<!DOCTYPE html>
<html>
<head>
  <style>
    p { background:#dad;
        font-weight:bold;
        font-size:16px;
    }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <button>Toggle 'em</button>

  <p>Hiya</p>
  <p>Such interesting text, eh?</p>
  <script>
    $("button").click(function () {
      $("p").toggle("slow");
    });    
  </script>

</body>
</html>




背景：爸爸；
字体大小：粗体；
字体大小：16px；
}
切换它们
你好

这么有趣的文字，嗯

$（“按钮”）。单击（函数（）{
$（“p”）。切换（“慢速”）；
});    

为什么它不起作用当我们将var visible=false放入click函数中时，我们正在交换值它应该更改var visible value我在回答中写道：每次执行事件处理程序时，都用false初始化visible。是的，您正在函数末尾更改
visible
，但随后函数终止并且
visible
超出范围。下次执行事件处理程序时，您将调用
var visible=false并且如果（可见）
将再次为
false
。无论何时调用函数，每次都会执行其中的每个语句。为什么您认为它应该跳过
var visible=false第二次？为什么它不起作用当我们将var visible=false放入click函数中时，我们正在交换值它应该更改var visible value我在回答中写道：每次执行事件处理程序时，都用false初始化visible。是的，您正在函数末尾更改
visible
，但随后函数终止并且
visible
超出范围。下次执行事件处理程序时，您将调用
var visible=false并且如果（可见）
将再次为
false
。无论何时调用函数，每次都会执行其中的每个语句。为什么您认为它应该跳过
var visible=false第二次？