jquery在click事件上添加类不起作用

时间:2015-09-30 05:40:42

标签: javascript php jquery

在我的项目中有菜单,我给它们子菜单的ID,它们在header.php中

<div class="top-menu">
    <ul>
    <nav class="cl-effect-13">
    <li><a href="about.php" id="about">About</a></li>
    <li><a href="product.php" id="product">Products</a></li>
    <li><a class="scroll" href="#news" id="news">News</a></li>
    <li><a href="typography.php" id="typo">Typo</a></li>
    <li><a href="contact.php" id="contact">Contact</a></li>
    </nav>
    </ul>
</div>

现在当我点击它时会转到about.php或如果我点击联系它转到contact.php。现在在about.php我插入像这样的jquery。

<script type="text/javascript">
    $(document).ready(function() {
            /*
            var defaults = {
            containerID: 'toTop', // fading element id
            containerHoverID: 'toTopHover', // fading element hover id
            scrollSpeed: 1200,
            easingType: 'linear' 
            };
            */
    $().UItoTop({ easingType: 'easeOutQuart' });
    $('#about').addClass('active');
});
</script>

对于不同的php文件我给diff。 ID。它工作正常,直到我在footer.php中插入以下代码

<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
            <script>
            function sendContactus() {
                var valid;  
                valid = validateContactto();
                if(valid) {
                    jQuery.ajax({
                    url: "dropusline.php",
                    data:'fname='+$("#fname").val()+'&lname='+$("#lname").val()+'&email='+$("#email").val()+'&phone='+$("#phone").val()+'&message='+$("#message").val(),
                    type: "POST",
                    success:function(data){
                    $("#mail-statusto").html(data);
                    },
                    error:function (){}
                    });
                }
            }

            function validateContactto() {
                var valid = true;   
                $(".text").css('background-color','');
                $(".error").html('');

                if(!$("#email").val()) {
                    $("#email-info").html("(required)");
                    $("#email").css('background-color','#FFFFDF');
                    valid = false;
                }
                if(!$("#message").val()) {
                    $("#message-info").html("(required)");
                    $("#message").css('background-color','#FFFFDF');
                    valid = false;
                }   
                return valid;
            }
            </script>

它是页脚部分查询的ajax代码,我在header.php中提到的所有文件都包含footer.php。我想要在footer.php以及jquery代码中执行的javascript代码。现在jquery代码没有执行。

2 个答案:

答案 0 :(得分:0)

看起来你没有宽松和ui totop脚本。 在调用插件之前包括它们。

按此顺序:

<script src="http://lab.mattvarone.com/projects/jquery/totop/js/jquery-1.7.2.min.js"></script>
<script src="http://lab.mattvarone.com/projects/jquery/totop/js/easing.js"></script>
<script src="http://lab.mattvarone.com/projects/jquery/totop/js/jquery.ui.totop.js"></script>

<script>
 $().UItoTop({easingType: 'easeOutQuart'});
</script>

答案 1 :(得分:0)

通过在f​​ooter.php

中删除此行来完成
<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>

它的反映是因为我已经像这样包含在header.php中了。

<script src="js/jquery.min.js"></script>

任何人都可以解释为什么不给它打两次电话?