为什么$('#id').click函数不起作用

Why is $('#id').click function not working

本文关键字:click 函数 不起作用 #id 为什么      更新时间:2023-09-26

它在本地主机上运行良好,但在服务器上不起作用。

当我点击"开始免费试用"锚文本时,它不起作用。警报没有显示。可能是什么问题?

<script>
 $(function() {
        $('#activator3').click(function(){
            alert('huan');
            $('#overlays3').fadeIn('fast',function(){
                $('#boxs3').animate({'top':'80px'},500);
            });
        });
        $('#boxclose3').click(function(){
            $('#boxs3').animate({'top':'-500px'},500,function(){
                $('#overlays3').fadeOut('fast');
            });
         });
    });
</script>
<a href="javascript:void(0)" style="" class="activator3" id="activator3">
<div id="indexpack2" style="">Start Free Trial</div>
</a>

这是Fiddle


备注

我试过:

  1. 添加document.ready()以包装脚本-不起作用

  2. $('#activator3').on('click', function(){});-不工作

如有任何帮助,我们将不胜感激。

编辑:通过添加JQUERY 解决

我认为您缺少Jquery引用。在您的文件中包括以下代码。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

您确定在JS之前加载jQuery吗?

应该有效。

<a href="#" style="" class="activator3" id="activator3">
  <div id="indexpack2" style="">Start Free Trial</div>
</a>

JS:

$(function() {
   $('#activator3').click(function(e) {
     e.preventDefault();
     alert('huan');
   });
 });

https://jsfiddle.net/4z871dp2/1/

在Fiddle中,您忘记添加jQuery,并且将JavaScript代码放错了位置。

如果你修复了这两件事,你的代码就会正常工作!


Demo

$(function() {
    $('#activator3').click(function(){
        alert('huan');
        $('#overlays3').fadeIn('fast',function(){
            $('#boxs3').animate({'top':'80px'},500);
        });
    });
    $('#boxclose3').click(function(){
        $('#boxs3').animate({'top':'-500px'},500,function(){
            $('#overlays3').fadeOut('fast');
        });
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<a href="javascript:void(0)" style="" class="activator3" id="activator3"><div id="indexpack2" style="">Start Free Trial</div></a>   				

(另请参见固定Fiddle