Ir para conteúdo
Fórum Script Brasil
  • 0

DIV Dinamicas


HQuintas

Pergunta

Viva

Estou criando várias DIVs dinamicamente, mas quando clicar numa gostaria de obter a sua ID individual de cada uma. Como posso fazer isso?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>javas</title>
    <style type="text/css">

    .dynamicDiv {
    width:200px;
    height:100px;
    position:absolute;
    background-color:silver;
    display:block;

      
    }

    </style>

<script type="text/javascript" language="javascript">
var i=0;
var w=0;
function varias(fil){
var k="150";
//alert("oi");
for (y=1;y<=3;y++){
for (x=1;x<=6;x++){
 w++;
        var divTag = document.createElement("div","id=" + w);
       
        //divTag.id = "div" + w;
        //divTag.name="div" + w;
      

        //document.getElementById("div1").style.backgroundImage = "url(images/green.gif)";
       divTag.style.backgroundImage = "url(" + w + ".jpg)";
        
       divTag.style.width="110px";
       divTag.style.top=k*y + "px";
       divTag.style.margin = "0px "+ k*x +"px";
   
       divTag.style.cursor = "hand";
       
       divTag.className ="dynamicDiv";
   
       divTag.onclick=function(){alert(document.activeElement.id)};
       divTag.innerHTML = document.activeElement.id;
        
       document.body.appendChild(divTag);


} //x


} //y

</script>

</head>
<body onload="varias('aviso.jpg');">

Link para o comentário
Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

  • 0

i aew HQuintas, bom troca essa linha:

var divTag = document.createElement("div","id=" + w);
por essa:
var divTag = document.createElement("div");
e logo abaixo dela coloque essa linha:
divTag.setAttribute( "id" , "id" + w );

bom espero que ajude abraço!

Link para o comentário
Compartilhar em outros sites

  • 0

bom carinha aqui ele retorna sempre a id da DIV clicada, vai ai o seu codigo com as alterações que eu já havia citado:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>javas</title>
    <style type="text/css">

    .dynamicDiv {
    width:200px;
    height:100px;
    position:absolute;
    background-color:silver;
    display:block;


    }

    </style>

<script type="text/javascript" language="javascript">
		var i=0;
		var w=0;
		function varias( fil )
		{
			var k="150";
			for (y=1;y<=3;y++)
			{
				for (x=1;x<=6;x++)
				{
					w++;
					var divTag = document.createElement("div");/* var divTag = document.createElement("div","id=" + w);*/
				       divTag.setAttribute( "id" , "id" + w ) ;/*linha adicionada*/
				       divTag.style.backgroundImage = "url(" + w + ".jpg)";

				       divTag.style.width="110px";
				       divTag.style.top=k*y + "px";
				       divTag.style.margin = "0px "+ k*x +"px";

				       divTag.style.cursor = "hand";

				       divTag.className ="dynamicDiv";

				       divTag.onclick= function(){ alert( this.id /*document.activeElement.id*/) } ;
				       divTag.innerHTML = divTag.getAttribute("id");/*document.activeElement.id*/

				       document.body.appendChild(divTag);
				}
			}
		}
</script>

</head>
<body onload="varias('aviso.jpg');">
</body>
</html>

espero que ajude abraço!

Editado por Romerito
Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,4k
×
×
  • Criar Novo...