web-dev-qa-db-fra.com

Ajouter un avertissement pour modifier le bouton slug/permalink sur l'écran de l'éditeur.

Je veux que les utilisateurs obtiennent un avertissement quand ils cliquent sur le bouton pour changer le permalien. Ils donneront une confirmation s'ils veulent continuer.

Voici ce que je suis venu avec:

//Setting a variable for the button Class.
var editSlug = document.getElementsByClassName("edit-slug");

//Detecting when the button is clicked.
editSlug[0].addEventListener ( "click", function() {

//Returning the value of the popup.
return confirm('Warning: Don't do this unless you have to.');

});

Le problème que je rencontre est que, même en cliquant sur Annuler, cela me permet toujours de modifier le lien de mon message. Si je sélectionne annuler, il est supposé renvoyer une valeur fausse et annuler l'événement consistant à cliquer sur le bouton de modification. Cela fonctionne bien pour d'autres boutons sur WP, tels que publier, mettre à jour, etc.

De plus, je ne peux générer le popup qu'une seule fois après le chargement de la page. Si je sélectionne une réponse et que je clique à nouveau sur Edit, je ne reçois plus de popup.

slugvisual-editor
3
Snake

WordPress a déjà associé des événements jQuery à ce bouton que vous pouvez omettre avec off() method, ou simplifier les choses et ajouter une superposition au-dessus de ce bouton et agir en tant que bouton invitant les utilisateurs à confirmer l'action de modification en premier lieu:

jQuery(document).ready(function($){
    var c = $('#edit-slug-buttons')
      , b = $('button',c).first();

    c.css({
        position: 'relative'
    }).append('<span class="se-overlay" style=" position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 4px 0; margin-top: -3px; cursor: pointer"></span>');


    $(document).on("click", "#edit-slug-buttons .se-overlay", function(e){
        if ( confirm("Warning: Don't do this unless you have to.") ) {
            $(this).closest('#edit-slug-buttons').children('button').first().trigger('click');
        }
        return e.preventDefault();
    });
});

J'espère que cela pourra aider.

4
Samuel Elh