La fonction jquery ajax() ne fonctionne pas correctement ou n'est même pas reconnue

Je travaille actuellement sur un projet utilisant les fonctions jquery ajax. Je veux juste que la fonction ajax affiche du texte à partir d'un fichier sur le serveur lorsqu'on clique sur un bouton, mais lorsque je clique sur le bouton, cela ne fait rien. J'ai essayé d'ajouter un message d'erreur mais cela ne semble pas fonctionner non plus. Je me suis assuré d'utiliser une version de jquery qui prend en charge la fonctionnalité ajax, j'ai même copié et collé du code à partir d'une source dont je sais qu'elle fonctionne, mais rien ne semble fonctionner.

Mon fichier de script Java

window.onload=loadDoc(); 

$(document).ready(function(){   // the function that should be getting called 

    $("#accountInfo").click(function(){ 

        $.ajax({url: "accountPerks.txt",  
            error: function(xhr, status, error) {
                var err = eval("(" + xhr.responseText + ")");
                alert(err.Message); 
            },
        success: function(result){ 

            $("#perksDiv").text(result);

        }});

    });

});  

//everything below here are functions for separate pages  

$(document).ready(function(){ 

    $("#member1Info").click(function(){ 

        $("#BandMember1").css("visibility", "visible");

    });

}); 
$(document).ready(function(){ 

    $("#member2Info").click(function(){ 

        $("#BandMember2").css("visibility", "visible");

    });

}); 

$(document).ready(function(){ 

    $("#member3Info").click(function(){ 

        $("#BandMember3").css("visibility", "visible");

    });

});



function newAlbum(){  

    
    var node = document.createElement("li"); 
    var textNode = document.createTextNode("aaaaallllpxas(2023)"); 
    node.appendChild(textNode); 
    document.getElementById("albumList").appendChild(node); 
    
    $("#sneakPeak").css("visibility", "hidden");
}


var getAlbum = document.getElementById("sneakPeak");  
getAlbum.onclick=function(){ 

    newAlbum();
}
  
    
function loadDoc() { 
    var xhttp = new XMLHttpRequest(); 
   xhttp.onreadystatechange = function(){ 
       if(xhttp.readyState == 4 && xhttp.status == 200){ 
           document.getElementById("ExtraText").innerHTML = xhttp.responseText;
       }
   }; 
   xhttp.open("GET", "TourInfo.txt", true); 
   xhttp.send();
}

La page sur laquelle je souhaite que le fichier texte apparaisse

<?php 
session_start(); 
?>

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>CMP204 Unit Two Coursework Template</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <link rel="stylesheet" href="css/style.css">
    
</head>
<body> 
<h1>User Profile</h1>
    <nav>
        <?php include_once "includes/links.php" ?>
    </nav>
<?php 

    echo "Welcome " . $_SESSION["accountName"] . ".<br>"; 
?> 

<button id="accountInfo" type="button" class="btn btn-info btn-md">Click here to learn about account privileges</button> // this button should display the text from the server 
<p id="perksDiv"> <p>    // the text from the server should be showing in this paragraph   




<div class="container-fluid">
    <div class="row">  
        <div class="col-sm-4"> 
        <form action="addGigsAttended.php" method="post"> 
            add gig attended 
            <input type="text" name="GigToAdd"> 
            <input type="submit"> 
        </form> 
         
        </div>  

        
        <div class="col-sm-4"> 
        <form action="editGigsAttended.php" method="post"> 
            edit gig you want to change
            <input type="text" name="GigToEdit">  
            <br> 
            select gig to replace it with
            <input type="text" name="GigToReplace">
            <input type="submit"> 
        </form> 
        </div>  


        <div class="col-sm-4"> 
        <form action="deleteGigsAttended.php" method="post"> 
            delete gig attended 
            <input type="text" name="GigToDelete"> 
            <input type="submit"> 
            </form>
             
            
        </div>
    </div>   
</div> 
<p>Here are all the gigs you have attended</p> 
</br> 
<?php 
$servername = "lochnagar.abertay.ac.uk";
$username = "sql2100904";
$password = "ftAYZgzXz6au";
$dbname = "sql2100904"; 
$conn = mysqli_connect($servername, $username, $password, $dbname); 
$accountName = $_SESSION["accountName"];
$getGigs = mysqli_prepare($conn, "SELECT gigName FROM $accountName"); 
$results = mysqli_stmt_execute($getGigs); 
mysqli_stmt_bind_result($getGigs, $GigLocation); 

while (mysqli_stmt_fetch($getGigs)) {
    echo $GigLocation . " ";
}

    mysqli_stmt_close($getGigs); 
    myslqi_close($conn);

?>






   
    

    <!--these scripts are necessary for Bootstrap and must be before the close body tag-->
    <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
    <script src="javascript/script2.js"></script>
</body>
</html>

P粉947296325451 Il y a quelques jours727

La fonction jquery ajax() ne fonctionne pas correctement ou n'est même pas reconnue

répondre à tous(1)je répondrai