Maison > Tutoriel CMS > WordPresse > Comment empêcher la redirection de page dans WordPress ?

Comment empêcher la redirection de page dans WordPress ?

PHPz
Libérer: 2024-03-05 09:33:04
original
1139 Les gens l'ont consulté

Comment empêcher la redirection de page dans WordPress ?

Comment empêcher la redirection de page dans WordPress ?

Dans le développement de sites Web, nous souhaitons parfois implémenter un paramètre de non-saut de page dans WordPress, c'est-à-dire que lors de certaines opérations, le contenu de la page peut être mis à jour sans actualiser la page entière. Cela améliore l’expérience utilisateur et rend le site Web plus fluide. Ensuite, nous partagerons comment implémenter le paramètre de non-saut de page dans WordPress et fournirons des exemples de code spécifiques.

Tout d'abord, nous pouvons utiliser Ajax pour réaliser la fonction de non-saut de page. Ajax est une technologie qui charge les données de manière asynchrone en arrière-plan sans recharger la page entière. Dans WordPress, nous pouvons implémenter le paramètre de non-saut de page via des fonctions de hook et des requêtes Ajax.

Voici les étapes et exemples de code pour implémenter le paramètre de non-saut de page :

Étape 1 : ajoutez le code suivant au fichier function.php du thème pour enregistrer le script Ajax et définir la fonction de rappel pour le traitement des requêtes Ajax :

add_action('wp_enqueue_scripts', 'enqueue_ajax_script');
function enqueue_ajax_script(){
    wp_enqueue_script('custom-ajax-script', get_template_directory_uri().'/js/custom-ajax-script.js', array('jquery'), '1.0', true);
    wp_localize_script('custom-ajax-script', 'ajax_object', array('ajax_url' => admin_url('admin-ajax.php')));
}

add_action('wp_ajax_nopriv_custom_ajax_request', 'custom_ajax_request');
add_action('wp_ajax_custom_ajax_request', 'custom_ajax_request');

function custom_ajax_request(){
    // 在这里处理Ajax请求
    $response = array('message' => '这是通过Ajax请求返回的数据');
    wp_send_json($response);
}
Copier après la connexion

Étape 2 : Créez un fichier js custom-ajax-script.js dans le dossier du thème, puis ajoutez le code suivant pour l'envoi des requêtes Ajax :

jQuery(document).ready(function($){
    $('#my-button').click(function(){
        $.ajax({
            url: ajax_object.ajax_url,
            type: 'post',
            data: {
                action: 'custom_ajax_request'
            },
            success: function(response){
                alert(response.message);
            }
        });
    });
});
Copier après la connexion

Étape 3 : Ajoutez un bouton à la page ou à l'article WordPress pour le déclenchement Requête Ajax :

<button id="my-button">点击我发送Ajax请求</button>
Copier après la connexion

Grâce aux étapes ci-dessus et aux exemples de code, nous pouvons implémenter le paramètre de non-saut de page dans WordPress. Lorsque l'utilisateur clique sur le bouton, la page demandera des données mises à jour via Ajax, mais la page entière ne sera pas actualisée, obtenant ainsi l'effet d'aucun saut de page.

Résumé :

La configuration sans saut de page est très courante dans le développement de sites Web, ce qui peut améliorer l'expérience utilisateur et rendre le site Web plus interactif. La clé pour obtenir des paramètres de non-saut de page dans WordPress est d'utiliser la technologie Ajax et de gérer les requêtes Ajax en arrière-plan. J'espère que le contenu ci-dessus pourra vous aider à implémenter avec succès les paramètres de non-saut de page dans WordPress.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal