Question

我正在尝试为我的数组中的每个项目创建一个按钮（来自数据库）。现在第一个按钮将按照它的方式工作，但是它下面的所有按钮都不会做任何事情。我尝试了很多不同的东西，但似乎无法让它发挥作用。如果您需要更多代码或有任何问题，请告诉我。

<html>

<head>


<link rel="shortcut icon" href="photos/favicon.ico" >
<link rel="stylesheet" type="text/css" href="css/home.css">
<link rel="stylesheet" type="text/css" href="css/home.css">
<script type="text/javascript" src="js/jquery.js "></script>
<head>
<link rel="stylesheet" href="css/styles.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>
</head>
</head><div id="container" >



<head>


<link rel="shortcut icon" href="photos/favicon.ico" >
<link rel="stylesheet" type="text/css" href="css/home.css">
<link rel="stylesheet" type="text/css" href="css/home.css">
<script type="text/javascript" src="js/jquery.js "></script>
<head>
<link rel="stylesheet" href="css/styles.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>
</head>
</head>          
<div id='header'>
<header >
<hr size="50px" color="#ff0000" text-align="right" value="Dustin's Resume" >
<script type="text/javascript" src="js/jquery-1.8.1.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<link rel='stylesheet' type='text/css' href='css/style.css' />
 <div class='menu'>
<img  class="hover-link" id="logo3" src="photos/logo3.png"   height="50px" align="left" alt="logo"  >
 <!--<a class='hover-link'>Navigation</a>-->
 <div class='sub'>
 <ul class='sub-options'>
  <li><a href="profile2.php?id=1"><img src="upload/142479139.jpg" width="100px" height="100px" text-align="center"/></a><br></li>
 <li><a href='default.php' style="text-size:30px;font-weight:bold;"><b>Home</b></h3></a></li>
 <li><a href='about.php' style="text-size:30px;font-weight:bold;"><b>About</b></h3></a></li>
 <li><a href='members.php' style="text-size:30px;font-weight:bold;"><b>Search</b></h3></a></li>
 <li><a href='contact.php' style="text-size:30px;font-weight:bold;"><b>Contact</b></h3></a></li>
  <li><a href='update.php' style="text-size:30px;font-weight:bold;"><b>Update Info</b></h3></a></li>
   <li><a href='updatepic.php' style="text-size:30px;font-weight:bold;"><b>Update Pic</b></h3></a></li>
   <li><a href='logout.php' style="text-size:30px;font-weight:bold;"><b>Logout</b></h3></a></li>
 </ul>
 </div>
</div>
</div>
<style>
#welcome {
margin-top: 0px;
color: #fff;
font: bold, 25px;
align: right;
}
</style>


<image align="right" position='fixed' id="logo" src="upload/142479139.jpg" width="50px" height="50px"></image>

    <p id='welcome' align='right'>Welcome back,<br></p>     

</header>

<head>


<link rel="shortcut icon" href="photos/favicon.ico" >
<link rel="stylesheet" type="text/css" href="css/home.css">
<link rel="stylesheet" type="text/css" href="css/home.css">
<script type="text/javascript" src="js/jquery.js "></script>
<head>
<link rel="stylesheet" href="css/styles.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>
</head>
</head><aside >
    <div >

    <br>
             <p align="center"> 
<head>
<link rel="stylesheet" href="css/styles.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>
</head>


            <form>
                <div class="label_div">Search People</div><br>
                <div class="input_container">
                    <input type="text" id="id" onkeyup="autocomplet()" autocomplete="off">
                    <ul id="list_id"></ul>
                </div>
            </form>
        </p>
             <a href="updatepic.php" alt="Update Picture"><image align="center" src="upload/142479139.jpg" width="150px" height="150px"></image></a>
             <br><br><br>
             <p><h3>Dustin Strader</h3></p>

    </div>

</aside><body><div id="content" ><script type="text/javascript">
function setbg(color)
{
document.getElementById("styled").style.background=color
}</script>




</head>

  <table align="center" >
    <tr>
      <td padding="10px" width="600" height="200" style="background-image: url('photos/post.png');  ">
      <a href="profile2.php?id=1" ><image  align="right" style="margin:0 50 0"  src="upload/142479139.jpg" width="75px" height="75px"></a>
    <div align="center"><label style="margin:0 0" id="px" >Damn I got this shit down!!!</label><br>












            <label style="margin:0 0; font-size:8px" id="px" >2014-06-19 03:28:36am</label><br></div>
    <div align="center">
    <form method="POST" action="default.php" >
    <label style="margin:0 0">
    <textarea maxlength="40" name="comment" id="" onfocus="this.value=''; setbg('#ffffff');" onblur="setbg('white')">Comment...</textarea>
    </label><br><br>
    <input type="hidden" name="ids" value="101" ></input>
        <div style=" margin:0 152px 0"  align="center"> <input  type="image" width="100px" height="35px" name="submits" src="photos/comment.png" alt="submit" />
<a href="vcomments.php?id=101" align="center"></a>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
 $(document).ready(function(){ 
$( "#dialog" ).dialog({
autoOpen: false,
show: {
effect: "blind",
duration: 1000},
hide: {
effect: "explode",
duration: 1000
}}); 
$( ".opener" ).live('click',function() {
$( "#dialog" ).dialog( "open" ); 
}); 
}); 




  </script>
</head>
<image class="opener" width="100px" height="35px"  src="photos/vcomment.png" > 






<div id="dialog" title="Basic dialog">
  <p>
  <label   ><p>2014-06-19 03:28:36</p></label><br>
<label   ><h3>Damn I got this shit down!!!</h3></label><br>
  <label   ><p align="center">2014-06-20 23:59:39</p></label><br>
<label  ><p align="center">777777777777777</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 23:53:36</p></label><br>
<label  ><p align="center">1111111111</p></label><br>
  </p>



   <label   ><p align="center">2014-06-21 00:33:10</p></label><br>
<label  ><p align="center">9999999999999</p></label><br>
  </p>



   <label   ><p align="center">2014-06-21 00:32:32</p></label><br>
<label  ><p align="center">44444444444444444</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 17:23:11</p></label><br>
<label  ><p align="center">cccccc</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 16:50:51</p></label><br>
<label  ><p align="center">hgjghjghj</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 16:24:43</p></label><br>
<label  ><p align="center">ffffffff</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 14:24:05</p></label><br>
<label  ><p align="center">jhnfgn</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 14:24:00</p></label><br>
<label  ><p align="center">fgdfg</p></label><br>
  </p>



   <label   ><p align="center">2014-06-19 04:34:09</p></label><br>
<label  ><p align="center">Comment...</p></label><br>
  </p>



 </div>
</div>  </form> </div >     
  </td>



    </tr>
  <table>




</head>

  <table align="center" >
    <tr>
      <td padding="10px" width="600" height="200" style="background-image: url('photos/post.png');  ">
      <a href="profile2.php?id=1" ><image  align="right" style="margin:0 50 0"  src="upload/142479139.jpg" width="75px" height="75px"></a>
    <div align="center"><label style="margin:0 0" id="px" >I love this site!!!</label><br>












            <label style="margin:0 0; font-size:8px" id="px" >2014-06-19 02:00:36am</label><br></div>
    <div align="center">
    <form method="POST" action="default.php" >
    <label style="margin:0 0">
    <textarea maxlength="40" name="comment" id="" onfocus="this.value=''; setbg('#ffffff');" onblur="setbg('white')">Comment...</textarea>
    </label><br><br>
    <input type="hidden" name="ids" value="100" ></input>
        <div style=" margin:0 152px 0"  align="center"> <input  type="image" width="100px" height="35px" name="submits" src="photos/comment.png" alt="submit" />
<a href="vcomments.php?id=100" align="center"></a>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
 $(document).ready(function(){ 
$( "#dialog" ).dialog({
autoOpen: false,
show: {
effect: "blind",
duration: 1000},
hide: {
effect: "explode",
duration: 1000
}}); 
$( ".opener" ).live('click',function() {
$( "#dialog" ).dialog( "open" ); 
}); 
}); 




  </script>
</head>
<image class="opener" width="100px" height="35px"  src="photos/vcomment.png" > 






<div id="dialog" title="Basic dialog">
  <p>
  <label   ><p>2014-06-19 02:00:36</p></label><br>
<label   ><h3>I love this site!!!</h3></label><br>
  <label   ><p align="center">2014-06-20 23:58:13</p></label><br>
<label  ><p align="center">Comment...</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 13:44:55</p></label><br>
<label  ><p align="center">Comment...</p></label><br>
  </p>



   <label   ><p align="center">2014-06-20 13:42:38</p></label><br>
<label  ><p align="center">Comment...</p></label><br>
  </p>



   <label   ><p align="center">2014-06-19 05:12:37</p></label><br>
<label  ><p align="center">i kove tis</p></label><br>
  </p>



 </div>
</div>  </form> </div >     
  </td>



    </tr>
  <table>




</head>

  <table align="center" >
    <tr>
      <td padding="10px" width="600" height="200" style="background-image: url('photos/post.png');  ">
      <a href="profile2.php?id=25" ><image  align="right" style="margin:0 50 0"  src="upload/425876911.jpg" width="75px" height="75px"></a>
    <div align="center"><label style="margin:0 0" id="px" >Today is a cool day.</label><br>












            <label style="margin:0 0; font-size:8px" id="px" >2014-06-18 03:38:45pm</label><br></div>
    <div align="center">
    <form method="POST" action="default.php" >
    <label style="margin:0 0">
    <textarea maxlength="40" name="comment" id="" onfocus="this.value=''; setbg('#ffffff');" onblur="setbg('white')">Comment...</textarea>
    </label><br><br>
    <input type="hidden" name="ids" value="92" ></input>
        <div style=" margin:0 152px 0"  align="center"> <input  type="image" width="100px" height="35px" name="submits" src="photos/comment.png" alt="submit" />
<a href="vcomments.php?id=92" align="center"></a>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
 $(document).ready(function(){ 
$( "#dialog" ).dialog({
autoOpen: false,
show: {
effect: "blind",
duration: 1000},
hide: {
effect: "explode",
duration: 1000
}}); 
$( ".opener" ).live('click',function() {
$( "#dialog" ).dialog( "open" ); 
}); 
}); 




  </script>
</head>
<image class="opener" width="100px" height="35px"  src="photos/vcomment.png" > 






<div id="dialog" title="Basic dialog">
  <p>
  <label   ><p>2014-06-18 15:38:45</p></label><br>
<label   ><h3>Today is a cool day.</h3></label><br>
  <label   ><p align="center">2014-06-20 13:40:09</p></label><br>
<label  ><p align="center">55555</p></label><br>
  </p>



 </div>
</div>  </form> </div >     
  </td>



    </tr>
  <table>




</head>

  <table align="center" >
    <tr>
      <td padding="10px" width="600" height="200" style="background-image: url('photos/post.png');  ">
      <a href="profile2.php?id=25" ><image  align="right" style="margin:0 50 0"  src="upload/425876911.jpg" width="75px" height="75px"></a>
    <div align="center"><label style="margin:0 0" id="px" >Dustin Rocks</label><br>












            <label style="margin:0 0; font-size:8px" id="px" >2014-06-18 03:38:34pm</label><br></div>
    <div align="center">
    <form method="POST" action="default.php" >
    <label style="margin:0 0">
    <textarea maxlength="40" name="comment" id="" onfocus="this.value=''; setbg('#ffffff');" onblur="setbg('white')">Comment...</textarea>
    </label><br><br>
    <input type="hidden" name="ids" value="91" ></input>
        <div style=" margin:0 152px 0"  align="center"> <input  type="image" width="100px" height="35px" name="submits" src="photos/comment.png" alt="submit" />
<a href="vcomments.php?id=91" align="center"></a>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
 $(document).ready(function(){ 
$( "#dialog" ).dialog({
autoOpen: false,
show: {
effect: "blind",
duration: 1000},
hide: {
effect: "explode",
duration: 1000
}}); 
$( ".opener" ).live('click',function() {
$( "#dialog" ).dialog( "open" ); 
}); 
}); 




  </script>
</head>
<image class="opener" width="100px" height="35px"  src="photos/vcomment.png" > 






<div id="dialog" title="Basic dialog">
  <p>
  <label   ><p>2014-06-18 15:38:34</p></label><br>
<label   ><h3>Rocks</h3></label><br>
  <label   ><p align="center">2014-06-20 13:40:16</p></label><br>
<label  ><p align="center">5555</p></label><br>
  </p>



 </div>
</div>  </form> </div >     
  </td>



    </tr>
  <table>




</div>

</body>

</div>


</html>

Answer 1

正如你所说，似乎元素没有唯一的ID。要么为每个元素使用唯一ID，要么声明可能很长的相关点击事件，要么添加类而不是id，并使用＆＃39; live / on＆＃39; 绑定添加点击事件，即< / p>

$(".buttonClasss").live('click',function(){
    //rest of you code.
 });

我需要让我的函数为数组中的每个项重复一次

1 个答案: