Question

$(document).ready(function(){ 
   $('.dlop1').hide('fast');    
   $('.dlop2').hide('fast'); 

   $('#dev1').click(function(){ 
     $('.dlop1').show('slow')
   }); 

   $('#dev2').click(function(){ 
    $('.dlop2').show('slow')
   });  
});

给定的j查询代码隐藏了dlop1＆amp; dlop2。但是不要在点击时显示它们。请帮忙。 js的链接摆弄了类似的问题http://jsfiddle.net/4kLor0q4/

Answer 1

JSFiddle

鉴于您的信息，一切正常。

<强> HTML

<div class="dlop1">dlop1</div>
<div class="dlop2">dlop2</div>
<div id="dev1">dev1</div>
<div id="dev2">dev2</div>

<强> JS

$(document).ready(function(){ 
   $('.dlop1').hide('fast');    
   $('.dlop2').hide('fast'); 

   $('#dev1').click(function(){ 
     $('.dlop1').show('slow')
   }); 

   $('#dev2').click(function(){ 
    $('.dlop2').show('slow')
   });  
});

Answer 2

您在这些行中缺少分号（;）：

$('.dlop1').show('slow')

$('.dlop2').show('slow')

Answer 3

使用toggle来显示和隐藏，而不是show

$(document).ready(function(){ 
   $('.dlop1').hide('fast');    
   $('.dlop2').hide('fast'); 

   $('#dev1').click(function(){ 
     $('.dlop1').toggle('slow');
   }); 

   $('#dev2').click(function(){ 
    $('.dlop2').toggle('slow');
   });  
});

的jsfiddle：http://jsfiddle.net/v873bk83/

Answer 4

您的代码似乎没有任何问题。这一切看起来都很好，这意味着你将不得不进行调试。

您可以通过将console.log()放入要单击的代码中来调试代码。

您的代码看起来像这样：

$('#dev1').click(function() {
    console.log($(this)); //reference to #dev1 but this could be a string as well
    $('.dlop1').show('slow');
});

您可能还希望在执行代码时检查控制台是否存在错误，并仔细检查ID为#dev1的元素是否存在或是否拼写错误 - 有时会发生这种情况。

此外，（着名的line inc :)作为后来的jQuery版本（取决于你使用的是哪一个，例如1.7+）$.on()是将事件绑定到元素的首选方法。

可以找到$.on()方法的文档here

希望这有帮助，祝你好运;）

Answer 5

也许你可以这样做

<html>
<head>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

 <input type="text" class="name" style="display:none;">Name...</input>
  <input type="submit" onclick="comment();">



<script>


         function comment()
         {

         $('.name').toggle( 3000 );

         }

 </script>


</body>

</html>

显示和隐藏不使用单击功能

5 个答案: