Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Peço de coracao para que, quem puder, criar um arquivo html e testar para ver o que acontece
<head>
<script type="text/javascript">
window.onload = function(){
var pai = document.getElementById("pai");
for(var i=1; i<=5;i++){
var m = i;
var div = document.createElement('div');
div.setAttribute('style' , 'width:200px; height:50px; float:left; margin-left:3px; border: 1px solid #000;');
div.onclick = function(){
alert("E agora meu valor => " + m);
}
div.innerHTML = "Meu valor => "+m;
pai.appendChild(div);
}
}
</script>
</head>
<body>
<div id='pai'>
</div>
</body>Bom, eu tenho uma ideia de porque isso acontece, mas como resolver?
se eu utilizar, por exemplo, div.setAttribute('teste' , m);
e depois, dentro do evento onclick utilizar
this.getAttribute('teste');
dai funciona, mas fica horrivel, imagina se voce tem um objeto inteiro e precisa passar por parametro, dai fudeu?
OBS: na verdade eu preciso passar um objeto que contem muita coisa, o exemplo acima é apenas para ter uma ideia do que esta acontecendo, ele sempre leva em consideracao o ultimo...
OBS2: Eu posso criar alguma coisa para mapear os objetos e passar algum indie para o atributo do elemento html, mas é muita gambiarra.... so que, se for o unico jeito, fazer oq...
cara do ceu, te amo, voce mora aonde? preciso te pagar uma cerveja!
haha, brincadeiras a parte, mas sera que voce sabe algum lugar que fale algo sobre esse assunto, gostaria de entender o porque disso.
Obrigado!
Att. paulo
achei as respostas para tudo aqui caso alguem tenha duvidas semelhantes
http://robertnyman.com/2008/10/09/explaining-javascript-scope-and-closures/
esta muito bem explicado
acho que deu por hoje, vlw willian
function addLinks () {
for (var i=0, link; i<5; i++) {
link = document.createElement("a");
link.innerHTML = "Link " + i;
link.onclick = function (num) {
return function () {
alert(num);
};
}(i);
document.body.appendChild(link);
}
}
window.onload = addLinks;por que tem aquele segundo parenteses? no exemplo caima a variavel i esta dentro dele.. so isso que nao esta me descendo, tipo
(function(){
alguma_coisa
})(QUEM_é_ESSE_CARA_AQUI)
achei epico o que esta abaixo, nunca tinha pensado nisso
for (var onclick = function(num){return function(){alert(num)}}, i=0, link; i<5; i++) {
link = document.createElement("a");
link.innerHTML = "Link " + i;
link.onclick = onclick(i);
document.body.appendChild(link);
}>
por que tem aquele segundo parenteses? no exemplo caima a variavel i esta dentro dele.. so isso que nao esta me descendo, tipo
(function(){
alguma_coisa
})(QUEM_é_ESSE_CARA_AQUI)
Isso é uma função anônima auto executável.
Primeiramente você define uma função anônima:
( function( param ){
} )
E logo depois executa a mesma passando os parametros necessários:
(function( param ){
//...
})( data );Uma aplicação prática é quando você não quer poluir o escopo global, e injetar dependências. Exemplo de uma aplicação que necessita do jQuery:
(function( $ ) {
var div = $( 'div' );
console.log( div ); //Irá exibir o objeto jQuery contendo as divs
}( jQuery ));
console.log( div ); //Irá ocorrer um erro, ReferenceError: div is not definedOutra aplicação é quando você quer ter membros privados em um Objeto:
var App = (function(){
var pub = {},
me = this;
pub.setFoo = function( foo ) {
me.foo = foo;
};
pub.getFoo = function() {
return me.foo;
};
return pub;
}());
App.setFoo( 'bar' );
console.log( App.getFoo() ); //'bar'
console.log( App.foo ); //undefinedfantastico, abriu minha mente, isso é muito massa
Obrigado pela explicacao JCMais e William
seu problema é escopo.
{ {