javascript - 自定义 Jquery 函数(显示/隐藏)的问题

Question

这是我的 JavaScript:

<script type="text/javascript">
$(document).ready(function(){
    function showhideitems(itemID){
      if ($(itemID).css('display') == 'none')
      {
        $(itemID).show('slow'); 
      } else { 
        $(itemID).hide('slow');
      } 
    }
});
</script>

当我使用以下方式调用该函数时:

`<a href="#" onClick="showhideitems('#players1')">`

它不起作用(div 不显示/隐藏)。上面的函数有什么问题？

Answer 1

将该函数放在ready()之外。您尝试调用的方法不在范围内。

<script type="text/javascript">
$(document).ready(function(){
   //do your startup/initializations here
});

 // This method should be available for you
 function showhideitems(itemID){
      if ($(itemID).css('display') == 'none')
      {
        $(itemID).show('slow'); 
      } else { 
        $(itemID).hide('slow');
      } 
  }
</script>

编辑 - 你可以尝试这个，但我不推荐它。

$(document).ready(function() {

  function showhideitems(itemID){
      if ($(itemID).css('display') == 'none') {
        $(itemID).show('slow'); 
      } else { 
        $(itemID).hide('slow');
      } 
  }


  $("#aID").click(function(){
                    event.preventDefault();
                    showhideitems('#players1');
                 });
}); 

Demo here