2009-07-10 12 views
5

Hubo un fundido de salida de la muestra en internet .. http://docs.dojocampus.org/dojo/fadeOut?t=tundraDojo, cómo hacerlo evento onclick en un DIV

pero quiero hacer algo diferente .. Quiero que la gente haga clic directamente en el texto a continuación, el el texto se desvanecerá.

en mi código no es un div ajustar el texto

<div id='parentNode'> 
    <div id='textDiv' onClick='whenClickAnyWhereWithinThisDiv_performFadeOut()'> 
     <div id='iconDiv'/> 
     <div id='messageDiv'/> 
    </div> 
<div> 

código como se muestra a continuación, lo que quiero es que cuando la gente haga clic en cualquier lugar dentro de la textDiv, entonces todo se desvanecerá textDiv away..hmm ..... ¿por qué mi código no funciona?

function whenClickAnyWhereWithinThisDiv_performFadeOut() { 
    ... 
    ... 
    dojo.connect(dijit.byId('textDiv'), "onClick", fadeOutAndRemove(parentNode, textDiv)); 
} 
function fadeOutAndRemove (parent, currentDiv) { 
    // just assume i can get the parent Node, and the current div, which will be textDiv  

    var objectId = currentDiv.getAttribute('id'); 
    dojo.style(objectId, "opacity", "1"); 
    var fadeArgs = { 
     node: objectId, 
     duration: 2000 
    }; 
    dojo.fadeOut(fadeArgs).play(); 

    setTimeout(function() { parent.removeChild(currentDiv);}, 2000); 
} 

Respuesta

8

Si entiendo lo que está tratando de hacer, creo que se puede lograr con esto:

HTML

<div id='parentNode'> 
    <div id='textDiv'> 
     <div id='iconDiv'>this is icon div</div> 
     <div id='messageDiv'>this is message div</div> 
    </div> 
<div> 

JavaScript

// do it when the DOM is loaded 
dojo.addOnLoad(function() { 
    // attach on click to id="textDiv" 
    dojo.query('#textDiv').onclick(function(evt) { 
    // 'this' is now the element clicked on (e.g. id="textDiv") 
    var el = this; 
    // set opacity 
    dojo.style(this, "opacity","1"); 
    // do fade out 
    dojo.fadeOut({ 
     node: this, 
     duration: 2000, 
     // pass in an onEnd function ref that'll get run at end of animation 
     onEnd: function() { 
     // get rid of it  
     dojo.query(el).orphan() 
     } 
    }).play() 
    }); 
}); 

El clic bu Bble hasta lo que va a ser atrapado por textDiv.

Aquí están algunos enlaces útiles:

Quiero saber si no he entendido bien su pregunta y voy a actualizar mi respuesta. Espero que esto ayude.