L'effet javascript ne fonctionne que sur le premier élément mais pas sur les autres?

Je fais écho aux enregistrements de la base de données qui sont enveloppés avec des balises html et essayait de mettre un peu d'effet sur les données renvoyées en écho. Lorsque je clique sur le lien d'édition, le champ de texte devrait trembler. Cela fonctionne sur le premier élément mais quand je clique sur le lien d'édition de l'élément suivant, le premier textfield secoue encore et pas l'autre.L'effet javascript ne fonctionne que sur le premier élément mais pas sur les autres?

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<title>Wallpost</title> 
<style> 

    .wallpost input[type="text"]{ 
     width: 500px; 
     height: 20px; 
    } 

    .wallpost input[type="submit"]{ 
     height: 26px; 
    } 


    .user{ 
     font-weight: bold; 
     font-size: 20px; 
    } 

    .post{ 
     font-family: Arial; 
    } 

    a{ 
     text-decoration: none; 
    } 

</style> 
</head> 
<body> 

<?php 

require_once 'dbconfig.php'; 



$user = $_SESSION['user'];; 

echo '<form action="post.php" method="post" class="wallpost"><input 
type="text" name="post" size="50"><input type="submit" name="wallpost" 
value="Post"></form>'; 

$query = $con->query("SELECT * FROM statuspost ORDER BY id DESC"); 

while($i = $query->fetch_object()){ 
    //echo $i->post.' '.$i->id.' <a href="wallpost.php?type=post& 
id='.$i->id.'" >Remove</a>'.'<br/>'; 
    echo '<span class="user">'.$i->user.'</span>'.'<br>'.'<span 
class="post">'.$i->post.'</span>'.' <form action="editpost.php?type=post& 
id='.$i->id.'" method="post"><span id="edit"><input type="text" 
name="edit"> 
<br/><input type="submit" value="Edit"></span><a href="#" 
onclick="showEdit();">Edit </a><a href="remove.php?type=post& 
id='.$i->id.'" >Remove</a></form> '.'<br/><br/>'; 
    //echo '<div id="post">'.$i->post.' '.$i->id.'<a href="#" 
id="anchor" class="',$i->id,'" onclick="del();">Remove</a></div> 
<br/>';  

} 


?> 


<script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.2.0 
/prototype.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/scriptaculous/1.9.0 
/scriptaculous.js"></script> 
<script> 

function showEdit(){ 

    Effect.Shake('edit'); 
} 

</script> 
</body> 
</html>

Source

2015-03-18 Renboy

Vous avez Dupliquons d'identité, ils doivent être uniques. – jeroen

Y a-t-il un moyen de les rendre uniques? Puisque j'ai seulement concaténé les étiquettes html avec les enregistrements échoués parce que les enregistrements pourraient être ajoutés et il est trop difficile de garder la trace de chacun d'eux. – Renboy

Remplacer <span id="edit"> par quelque chose comme <span id="edit'.$i->id.'"> d'avoir différents ids sur chacun des éléments. Alors bien sûr, showEdit() doit savoir quel identifiant il doit secouer, donc il doit prendre un paramètre. Ou encore plus simple: remplacer onclick="showEdit();" par onclick="Effect.Shake(\'edit'.$i->id.'\');"

Source

2015-03-18 10:59:10 Nytux

Salut, je veux savoir comment je peux instancier le paramètre parce que scriptaculous ne semble pas prendre des classes comme attributs, seulement id. J'essaie d'obtenir l'attribut de la balise span, mais seul l'identifiant est accepté. – Renboy

Oh, passons, j'ai compris. Merci! – Renboy

Merci pour la nouvelle mise à jour! – Renboy

effets Scriptaculous prennent soit une carte d'identité ou une référence JavaScript à un élément DOM comme premier argument, donc si vous ajoutez un nom de classe à vos multiples éléments, vous pouvez secouer tous à la fois comme ceci:

<span class="shake-me">...</span> 
<span class="shake-me">...</span> 
<span class="shake-me">...</span>

l'intérieur d'un recenseur:

$$('.shake-me').each(function(elm){ 
    Effect.Shake(elm); 
});

Source

2015-03-28 16:25:03 Walter

L'effet javascript ne fonctionne que sur le premier élément mais pas sur les autres?

Répondre

Questions connexes