Nov 172013
 

Pour détecter un clic dans la page html (n’importe où) avec jQuery :

    // Détection d'un clic dans la page
    $('html').click(function() {
        // votre code
    });

Pour qu’un élément ne pas passe par l’événement ci dessus (exemple si on souhaite afficher ou cacher un menu via un bouton et cacher le menu en dehors d’un clic sur ce bouton) il suffit d’ajouter « event.stopPropagation(); » :


    // Détection d'un clic sur le bouton pour afficher ou cacher le menu
    $("a#btn-menu").click(function(event){
        event.stopPropagation(); // pour éviter de cacher le menu
        cacheAfficheMenu();
    });
   
    // Détection d'un clic dans la page pour cacher le menu
    $('html').click(function() {
        cacheMenu();
    });
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 0.0/10 (0 votes cast)
Oct 232013
 

Exemple de script permettant de récupérer une variable utilisée dans une fonction en Javascript :

$(function() {
    var mavariable = null;

    function init() {
        mavariable = "Blablabla";
    }

    init();

    $('a').click(function() {
        alert('valeur de mavariable' + mavariable);
    });
});

VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 5.4/10 (5 votes cast)
Oct 022013
 

Logo CKEditor

Pour détecter la modification d’un champs CKEditor et effectuer une action à chaque saisie d’un caractère :

  1. télécharger le plugin « onchange »

    http://alfonsoml.blogspot.fr/2012/05/recipe-live-preview-of-ckeditor.html

  2. installer le
    – dezipper le répertoire complet du plugin dans le repertoire de ckeditor
    – ouvrir le fichier build-config.js
    – ajouter la ligne ‘onchange’ : 1

    /**
     * @license Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
     * For licensing, see LICENSE.html or http://ckeditor.com/license
     */
    
    /**
     * This file was added automatically by CKEditor builder.
     * You may re-use it at any time at http://ckeditor.com/builder to build CKEditor again.
     *
     * NOTE:
     *    This file is not used by CKEditor, you may remove it.
     *    Changing this file will not change your CKEditor configuration.
     */
    
    var CKBUILDER_CONFIG = {
        skin: 'moono',
        preset: 'basic',
        ignore: [
    ...
        ],
        plugins : {
       ...
            'onchange' : 1
        },
        languages : {
            'en' : 1,
            'fr' : 1,
        }
    };
  3. maintenant pour ajouter l’event sur l’iframe de ckeditor
    CKEDITOR.on('instanceCreated', function (e) {
        e.editor.on('change', function (ev) {
            $(".rendu").html(ev.editor.getData());
        });
    });
  4. VN:F [1.9.22_1171]
    Cette astuce est pratique ? laissez un vote ;)
    Rating: 10.0/10 (1 vote cast)
Sep 262013
 

Pour activer l’autocomplete (JQuery UI) uniquement en cliquant sur le bouton recherche.

Le champs HTML :



Autocomplete sur le champs, on fixe l’option « minLength » pour ne pas le déclencher automatiquement :

var source = ['un', 'deux', 'trois', 'quatre'];

$("input#autocomplete").autocomplete({
    minLength: 10000,
    source: source
});

Pour lancer la recherche via le click sur le bouton « recherche » :

$('#btn-recherche').on('click', function(){
        var champs = $( 'input#autocomplete' );
        var valeur = champs.val();
        if ( $.trim(valeur) != '' ) { 
            champs.addClass('ui-autocomplete-loading');       
            champs.autocomplete('option', 'minLength', 0);
            champs.autocomplete('search',valeur);
            champs.removeClass('ui-autocomplete-loading');   
            champs.autocomplete('option', 'minLength', 10000);
        } 
    });
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 8.5/10 (2 votes cast)
Sep 192013
 

Après avoir chargé du contenu ou une page dans une div avec load() ou append() par exemple, vous constatez que les éléments n’ont pas la même apparence ou style de JQuery Mobile, il faut actualiser votre page en ajoutant « trigger create » :

$("#ma-page").load("mapage.html", function () {
 $(this).trigger('create');
});

Si vous utilisez des listes cela ne suffira pas il faudra également les rafraichir :

$('ul').listview('refresh');
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 10.0/10 (1 vote cast)
Oct 262012
 

Deux solutions :

  • Redirection type lien ( <a href> )
    window.location.href = "http://www.votre-url.com";
  • Redirection HTTP ( l’historique de la navigation n’est pas sauvegardée dans ce cas )
    window.location.replace("http://www.votre-url.com");
VN:F [1.9.22_1171]
Cette astuce est pratique ? laissez un vote ;)
Rating: 0.0/10 (0 votes cast)