web-dev-qa-db-fra.com

Meilleures pratiques pour séparer jQuery de HTML/PHP

Je crée plusieurs scripts jQuery pour aider à valider les formulaires avant leur envoi. J'ai lu qu'il était préférable de toujours séparer les scripts jQuery dans un fichier séparé pour pouvoir le charger avec wp_enqeue_script .

Cependant, si je fais quelque chose comme ça:

jQuery(function()
{
    var ButtonSelector = "#submit-button";

    jQuery(document).on('click', ButtonSelector, function()
    {
        var ValidEntry = true;

        ClearError('#venue_name');
        var name = jQuery("#venue_name").val();
        if (name == "")
        {
            CreateError("#venue_name", "Name is Required");
            ValidEntry = false;
        }

        if (!ValidEntry)
        {
            jQuery('html, body').animate({scrollTop:0}, 'slow');
        }

        EnableButton(ButtonSelector);
        return false;
    });
});

Étant donné que cette fonction n’est utilisée que sous une seule forme, serait-il toujours judicieux de la séparer? Si je le séparais, cela ne voudrait-il pas dire qu'il se chargerait pour chaque page?

jquerywp-enqueue-scriptcustomization
5
William

Vous pouvez cibler une page spécifique à l'aide de is_page() lorsque vous mettez en file d'attente votre fichier JS.

function my_scripts_method() {
    if( is_page('your page title') ){
      wp_enqueue_script( 'your-js-script' );
    }
}

add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

De cette façon, vous mettrez sous condition votre JS vers cette page uniquement .

6
RRikesh

vous pouvez toujours placer le script dans un fichier js séparé, mais en le séparant du reste de votre script (-files) - et le mettre en file d'attente de manière conditionnelle, par exemple:

if (is_page_template('abc-xyz.php')) {
    wp_enqueue_script('your_script-js', get_template_directory_uri() . '/inc/js/your_script.js', array('jquery'), '1.00', true);
}

ce serait dans votre functions.php, où vous mettez vos scripts en file d'attente

1
Nicolai

Lorsque vous utilisez is_page(), je vous recommande également de le faire avec un || car le titre et le nom de la page (ou slug de la page) peuvent changer, ne serait-ce que par accident. Vous pouvez également utiliser l'ID de page, mais cela peut également ne pas être cohérent entre développement et production.

Par exemple:

if ( is_page( $name ) || is_page( $id ) || is_page( $title ) ) {}

Surpuissance? Peut-être. Mais c'est quelque chose à prendre en compte.

0
Chief Alchemist