AJAX utilitzat a /0capsa_dic/index.php

$(document).ready(function () {
    // Quan el DOM estigui completament carregat, s'executa aquesta funció.
    $("#cercar").on("keyup", function () {
        // Associem un esdeveniment 'keyup' al camp de text amb ID 'cercar'.
        var paraula = $(this).val(); // Obtenim el valor actual del camp de text.
        console.log("Tecla premuda: " + paraula); // Mostrem el valor a la consola per depuració.

        if (paraula.length > 0) {
            // Si hi ha text al camp de cerca (longitud major que 0), fem una crida AJAX.
            $.ajax({
                url: "cercar.php", // URL del script del servidor que processarà la sol·licitud.
                type: "POST", // Mètode HTTP utilitzat per enviar les dades.
                data: { cercar: paraula }, // Dades enviades al servidor (la paraula buscada).
                success: function (resposta) {
                    // Funció que s'executa si la crida AJAX té èxit.
                    console.log("Resposta AJAX rebuda"); // Missatge de depuració.
                    var resultats = JSON.parse(resposta); // Convertim la resposta JSON a un array JavaScript.
                    var htmlResultats = resultats.map(function (item) {
                        // Creem elements HTML (<li>) per a cada resultat.
                        return "<li class='resultat'>" + item + "</li>";
                    }).join(""); // Unim els elements en una cadena HTML.
                    $("#resultats_autocompletar").html(htmlResultats); // Inserim els resultats al contenidor.
                },
                error: function () {
                    // Funció que s'executa si hi ha un error en la crida AJAX.
                    console.error("Error en la crida AJAX."); // Missatge d'error a la consola.
                }
            });
        } else {
            // Si el camp de cerca està buit, esborrem els resultats previs.
            $("#resultats_autocompletar").html("");
        }
    });

    // Afegim un esdeveniment de clic per als elements de la llista de resultats.
    $(document).on("click", ".resultat", function () {
        var paraulaSeleccionada = $(this).text(); // Obtenim el text de l'element clicat.
        console.log("Paraula seleccionada: " + paraulaSeleccionada); // Mostrem el text a la consola.
        $("#cercar").val(paraulaSeleccionada); // Col·loquem el text seleccionat al camp de cerca.
    });
});