简体   繁体   English

为什么我的jquery脚本在我的include php文件中不起作用?

[英]why my jquery script doesn't work in my include php file?

I try to understand why my jquery script doesn't work at all in my php included files. 我试着理解为什么我的jquery脚本在我的php包含文件中根本不起作用。 index.php: index.php文件:

<?PHP  
session_start();
include_once("./tools/globalFunction.php");
?>
<!doctype html>
<html lang="fr">
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
        <title>Jojo Site</title>
    </head>
    <body>
        <?PHP 
        include_once("application.php");
        include_once("layout/menu.php");
        include_once("layout/loginModal.php");
        include_once("layout/container.php");
        include_once("layout/footer.php");  
        ?>
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
        <script type="text/javascript" src="./editor/ckeditor/ckeditor.js"></script>
        <script type="text/javascript" src="./js/javaScriptGlobalFunction.js"></script>
    </body>
</html>

menu.php: menu.php:

    <div class="collapse navbar-collapse justify-content-end" id="navbarNavConnexion">
        <ul class="navbar-nav">    
            <li id="adminButton" class="nav-item">
                <?php
                if (!$_SESSION['admin']){?>
                <button id="connexion" class="btn btn-dark" href="#" data-toggle="modal" data-target="#loginModal">Connexion</button> <?php ;}
                else {?>
                <button id="deconnexion" class="btn btn-dark" href="#" >Déconnexion</button> <?php ;}    
                ?>
            </li>
        </ul>
    </div>

javaScriptGlobalFunction.php: javaScriptGlobalFunction.php:

$("#Connexion").click(function(){
    alert('connexion')
});
$("#Deconnexion").click( function() {
    alert('déconnexion')
});   

With those code lines it doesn't work whereas if i put the jquery script include and my script at the end of the menu file like : 使用这些代码行它不起作用,而如果我把jquery脚本include和我的脚本放在菜单文件的末尾,如:

    <div class="collapse navbar-collapse justify-content-end" id="navbarNavConnexion">
        <ul class="navbar-nav">    
            <li id="adminButton" class="nav-item">
                <?php
                if (!$_SESSION['admin']){?>
                <button id="connexion" class="btn btn-dark" href="#" data-toggle="modal" data-target="#loginModal">Connexion</button> <?php ;}
                else {?>
                <button class="btn btn-dark" href="#" id="deconnexion">Déconnexion</button> <?php ;}    
                ?>
            </li>
        </ul>
    </div>
</nav>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script type="text/javascript">
$("#deconnexion").click(function(){alert('deconnexion')});
</script>

It's run... Is there something i didn't seen well or i have to place jquery and script directly in each file? 它运行...有什么我没有看到很好或我必须直接在每个文件中放置jquery和脚本?

It's probably not working because in javaScriptGlobalFunction.js you're trying to find elements by id with first letter in uppercase, while in html id is all lowercase. 它可能不起作用,因为在javaScriptGlobalFunction.js你试图通过id以大写的第一个字母来查找元素,而在html中id是全小写的。 In javaScriptGlobalFunction.js change javaScriptGlobalFunction.js更改

$("#Connexion").click(function(){
    alert('connexion')
});
$("#Deconnexion").click( function() {
    alert('déconnexion')
});

to

$("#connexion").click(function(){
    alert('connexion');
});
$("#deconnexion").click(function() {
    alert('déconnexion');
});

At first korrekt lower/higher key: $("#Deconnexion") != id="connexion" 起初korrekt更低/更高的关键:$(“#Deconnexion”)!= id =“connexion”

Also your script will run befor your html is rendered by browser. 此外,您的脚本将运行,因为您的html是由浏览器呈现的。 Put it into 把它放入

$(function () {
  $("#connexion").click(function(){
    alert('connexion');
  });
  $("#deconnexion").click(function() {
    alert('déconnexion');
  });
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM