Problème avec le tableau jQuery

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script> 
<script type="text/jscript"> 
    $('document').ready(function(){ 
     var clickNo=0; 
     $('div#pics>img').hide() 
     $('div#pics>input').click(function(event){ 
      $('div#pics>img')[0].show('slow'); 
     }) 

    }); 
</script> 
</head> 
<body> 
<div id="pics"> 
<input type="button" value="next" /> 
<--a bunch of img tags .I had to resort to this comment because the system won't 
    let me include the img tag in the code--> 
</div> 
</body> 
</html>

Je ne comprends pas pourquoi la ligne $('div#pics>img')[0].show('slow'); ne fonctionne pas.Problème avec le tableau jQuery

Source

2010-03-21 Bunny Rabbit

Astuce:. Au lieu de '$ ('document') prêt (function() {...})' vous pouvez écrire simplement '$ (function () {...}) '. –

J'ai plusieurs morceaux de conseils:

Si les images sont censées être cachées sur chargement de la page, les cacher avec CSS Javascript;
La spécification d'un nom de tag et d'un ID ([email protected]) a peu de valeur. Il suffit de spécifier l'ID (#pics);
La notation matricielle ([0]) est une abréviation de get(0). Il renvoie un élément DOM et non un objet jQuery. L'objet jQuery est celui qui a une méthode show(); et
jQuery va jusqu'à 1,4,2; et
Je ne sais pas exactement ce que vous essayez de faire avec votre gestionnaire click(). Le nom "suivant" implique que vous voulez les parcourir?

Comprenant tout ce que:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<style type="text/css"> 
#pics img { display: none; } 
</style> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script type="text/jscript"> 
$(function() { 
    $("#pics > input").click(function(event) { 
    var images = $("#pics img"); 
    var visible = images.filter(":visible"); 
    if (visible.length == 0) { 
     images.eq(0).show("slow"); 
    } else { 
     var index = images.index(visible[0]); 
     visible.hide("slow"); 
     $(images[(index + 1) % images.length]).show("slow"); 
    } 
    }); 
}); 
</script> 
</head> 
<body> 
<div id="pics"> 
<input type="button" value="next" /> 
<--a bunch of img tags .I had to resort to this comment because the system won't 
    let me include the img tag in the code--> 
</div> 
</body> 
</html>

Source

2010-03-21 16:05:57 cletus

Grats sur 100k cletus :) –

@Nick merci, monsieur! :) – cletus

Cela devient l'élément DOM natif, et non l'objet jQuery (qui ne possède pas de fonction .show()), ce que vous voulez à la place est :first comme celui-ci de sorte que vous obtenez l'objet jQuery:

$('div#pics>img:first').show('slow');

Ou, dans votre format actuel, obtenir le premier match comme celui-ci:

$('div#pics>img:eq(0)').show('slow'); 
//Or.. 
$('div#pics>img').eq(0).show('slow');

Je suppose que ce nombre va changer/montée, de sorte que la dernière option semble être la meilleure approche dans votre cas.

Source

2010-03-21 16:00:18

Problème avec le tableau jQuery

Répondre

Questions connexes