Comment assigner dynamiquement un attribut JavaScript 'onclick'?

Je crée un bouton dynamiquement en utilisant JavaScript et en même temps en assignant des attributs tels que 'ID', 'type' etc et aussi 'onclick' afin de déclencher une fonction.Comment assigner dynamiquement un attribut JavaScript 'onclick'?

Tout fonctionne correctement, à l'exception de l'affectation de 'onclick'. Lorsque vous cliquez dessus, le bouton ne déclenche pas la fonction comme prévu. la fonction que j'essaie de lancer est 'naviguer (-1)' comme on le voit ci-dessous.

Où est-ce que je me trompe?

Voici mon code:

function loadNavigation() { 
var backButton; 
backButton = document.createElement('input'); 
backButton.ID = 'backButton'; 
backButton.type = 'button'; 
backButton.value='Back'; 
backButton.onclick = 'navigate(-1)'; 
document.body.appendChild(backButton); 
}

Source

2010-06-09 Jack Roscoe

Une vieille question mais cela doit être dit: vous ne plus assigner onclick;) utiliser button.addEventListener ('clic', fonction) au lieu. – AxelH

@AxelH Quelle est la raison d'utiliser 'addEventListener' sur' onclick'? –

Onclick est un ancien attribut permettant de lier une fonction à un événement. AddEventListener utilise une collection pour stocker les fonctions pour chaque événement, ce qui signifie que vous pouvez ajouter autant de fonctions que vous le souhaitez pour un événement. Cela peut empêcher un comportement inattendu si vous avez des fonctionnalités de paramétrage de script qui pourraient remplacer d'autres fonctionnalités. Onclick est utile pour le code de débogage rapide mais en production, je ne l'utiliserais pas. – AxelH

Comme dit l'autre, vous devez attribuer une fonction.

Je voulais juste souligner que, dans ce cas, vous voulez passer une valeur de sorte que vous devez attribuer une fonction anonyme (ou une ligne définie par fonction nommée) comme

button.onclick = function() {otherfunction(parameter)};

Si la fonction que vous souhaitez affecter ne nécessite pas un paramètre que vous pouvez l'utiliser directement

button.onclick = otherfunction;

Notez qu'il n'y a pas de parenthèse dans ce cas

button.onclick = otherfunction(); // this doesn't work

ne fonctionnera pas car il appellera otherfunction dès qu'il est analysé

Source

2010-06-09 15:40:10 nico

vous assignez du texte à l'onclick, essayez d'affecter une fonction.

backButton.onclick = function(){navigate(-1);};

Source

2010-06-09 15:36:45 jasonmw

Utilisez une fonction au lieu d'une chaîne. Par exemple,

backButton.onclick = function() { navigate(-1); };

Source

2010-06-09 15:36:54

Vous devez affecter une fonction, pas une chaîne.

backButton.onclick = function wastefulDuplicationOfBackButton() { 
    navigate(-1); 
}

Source

2010-06-09 15:36:57 Quentin

+1 pour le nom de la fonction – jessegavin

@jessegavin, eh bien, dans IE vous finissez avec * deux * objets de fonction en raison d'un bug sérieux sur l'implémentation JScript de [Named Function Expressions] (http://yura.thinkweb2.com/named- function-expressions /), pas une si bonne chose: (... – CMS

Va montrer que vous pouvez faire cela pendant des années et encore apprendre de nouvelles choses ... surtout de nouveaux problèmes avec IE, mais de nouvelles choses néanmoins! – Quentin

Vous devez assigner une fonction, pas une chaîne:

//... 
backButton.onclick = function() { 
    navigate(-1); 
}; 
//...

Source

2010-06-09 15:36:57 CMS

backButton.onclick = function() { navigate(-1); }

Source

2010-06-09 15:39:02

Comment assigner dynamiquement un attribut JavaScript 'onclick'?

Répondre

Questions connexes