Foros del Web - Ver Mensaje Individual - como obtener rl primer elemento del objeto

xalupeao · #4 (**permalink**) 27/02/2011, 02:15

te doy ejemplo completo.

Código HTML:

Ver original<!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=utf-8" />
<title>Documento sin título</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script language="javascript">
$(document).ready(function(){
    $("#capas").data("ids",1);
    $("#crearcapa").click(function(e){
        e.preventDefault();
        var ids = $("#capas").data("ids");
        //creamos la capa
        $("#capas").append('<div class="capa" id="capa_' + ids + '">Esto es la capa numero: ' + ids + '</div>');
        $("#capas").data("ids",ids + 1);
    });
    $(".capa").click(function(){
        alert($(this).attr("id"));
    });
});
</script>
</head>
 
<body>
<div id="capas">
    
</div>
<input id="crearcapa" type="button"  value="crear capa" />
</body>
</html>

como te puedes dar cuenta no da el alert.

------------

ahora si lo dejas asi.

Código HTML:

Ver original<!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=utf-8" />
<title>Documento sin título</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script language="javascript">
$(document).ready(function(){
    $("#capas").data("ids",1);
    $("#crearcapa").click(function(e){
        e.preventDefault();
        var ids = $("#capas").data("ids");
        //creamos la capa
        $("#capas").append('<div class="capa" id="capa_' + ids + '">Esto es la capa numero: ' + ids + '</div>');
        $("#capas").data("ids",ids + 1);
        
        $(".capa").click(function(){
            alert($(this).attr("id"));
        });
    });
});
</script>
</head>
 
<body>
<div id="capas">
    
</div>
<input id="crearcapa" type="button"  value="crear capa" />
</body>
</html>

funciona ... pero si te das cuenta pasa que lanza un alert por cada capa....

desde ya muchas gracias.