Php javascript效果只对第一个元素有效，对其他元素无效？_Php_Html_Prototypejs_Scriptaculous

Php javascript效果只对第一个元素有效，对其他元素无效？

php html

Php javascript效果只对第一个元素有效，对其他元素无效？,php,html,prototypejs,scriptaculous,Php,Html,Prototypejs,Scriptaculous,我正在回显数据库中用html标记包装的记录，并试图对回显的数据施加一些影响。当我单击编辑链接时，文本字段应该会抖动。它在第一个元素上工作，但当我单击下一个元素的编辑链接时，第一个文本字段仍然会震动，而不是另一个 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Wallpost</title> <style> .w

我正在回显数据库中用html标记包装的记录，并试图对回显的数据施加一些影响。当我单击编辑链接时，文本字段应该会抖动。它在第一个元素上工作，但当我单击下一个元素的编辑链接时，第一个文本字段仍然会震动，而不是另一个

<!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>


墙柱
.wallpost输入[type=“text”]{
宽度：500px；
高度：20px；
}
.wallpost输入[type=“submit”]{
高度：26px；
}
.用户{
字体大小：粗体；
字体大小：20px；
}
.邮政{
字体系列：Arial；
}
a{
文字装饰：无；
}
将
替换为类似
的内容，以便在每个元素上具有不同的ID。当然，showEdit（）
必须知道它必须抖动哪个id，所以它必须接受一个参数。或者更简单：将onclick=“showEdit（）；”
替换为onclick=“Effect.Shake（\'edit'.$i->id.\'）；“
Scriptaculous效果将id或对DOM元素的JavaScript引用作为其第一个参数，因此，如果向多个元素添加一个类名，则可以像这样一次摇晃所有元素：
<span class="shake-me">...</span>
<span class="shake-me">...</span>
<span class="shake-me">...</span>

你有重复的ID，它们必须是唯一的。有没有办法使它们唯一？因为我只将html标记与回显记录连接起来，因为可能会添加记录，而且很难跟踪每个记录。嗨，我想知道如何实例化参数，因为scriptaculous似乎不将类作为属性，而只是id。我正在尝试获取span标记的属性，但只接受id。
$$('.shake-me').each(function(elm){
  Effect.Shake(elm);
});