jQuery « jeton inattendu ILLÉGALE »

Question

J'ai deux fonctions, qui sont pour montrer et éléments cacher par classe:

if (typeof showClass != 'function') { 
    function showClass(trClass, buttonId, hideMessage, showMessage) { 
     var button = '#' + buttonId; 
     var value = hideMessage; 
     $(button).attr("value", value); 
     $(button).attr("onclick", "hideClass('" + trClass + "', '" + buttonId + "', '" + showMessage + "', '" + hideMessage + ");"); 
     var classToShow = '.' + trClass; 
     $(classToShow).css('visibility', 'visible'); 
    } 
} 

if (typeof hideClass != 'function') { 
    function hideClass(trClass, buttonId, showMessage, hideMessage) { 
     var button = '#' + buttonId; 
     var value = showMessage; 
     $(button).attr("value", value); 
     $(button).attr("onclick", "showClass('" + trClass + "', '" + buttonId + "', '" + hideMessage + "', '" + showMessage + ");"); 
     var classToHide = '.' + trClass; 
     $(classToHide).css('visibility', 'hidden'); 
    } 
} 

showClass fonctionne comme exceptées, mais hideClass provoque une erreur « jeton inattendu ILLÉGALE » dans Chrome. Avec FireFox je ne reçois aucune erreur, mais la fonction ne fonctionne pas avec l'un des navigateurs. J'ai essayé avec différents éditeurs de trouver des caractères illégaux, etc., mais pas de chance. Quelle pourrait être la cause de cela?

Answer 1

Vous essayez apparemment de configurer un bouton de basculement, mais c'est le désordre le plus compliqué de jQuery et des gestionnaires d'événements en ligne que j'ai jamais vu.

Essayez ceci:

function setupToggle(trigger, target, hideMessage, showMessage) { 
    var state = false;  // true means button says "show", target is hidden 
    var $el = $(trigger); 

    function update() { 
     $el.attr('value', state ? showMessage : hideMessage); 
     $(target).css('visibility', state ? 'hidden' : 'visible'); 
    } 

    update(); // set initial state 

    $el.on('click', function() { 
     state = !state; // on click, flick state and refresh 
     update(); 
    }); 
} 

utilisation

:

setupToggle('#mybutton', '.mytr', 'Hide it', 'Show it'); 

Le code ci-dessus peut nécessiter quelques réglages mineurs selon que l'état par défaut est "caché" ou "montré".