Javascript 我需要让我的函数为数组中的每个项重复它自己

Javascript 我需要让我的函数为数组中的每个项重复它自己,javascript,php,jquery,html,arrays,Javascript,Php,Jquery,Html,Arrays,我正在尝试为数组中的每个项目(从数据库)创建一个按钮。现在,第一个按钮将按预期的方式工作,但它下面的所有按钮都将不起任何作用。我试过很多不同的方法,但似乎都没能奏效。如果您需要更多的代码或有任何问题,请告诉我 <html> <head> <link rel="shortcut icon" href="photos/favicon.ico" > <link rel="stylesheet" type="text/css" href="css/home

我正在尝试为数组中的每个项目(从数据库)创建一个按钮。现在,第一个按钮将按预期的方式工作,但它下面的所有按钮都将不起任何作用。我试过很多不同的方法,但似乎都没能奏效。如果您需要更多的代码或有任何问题,请告诉我

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



正如您所说,元素似乎没有唯一的id。或者为每个元素使用唯一的id并声明相关的单击事件,这可能需要很长的时间,或者添加类而不是id并使用'live/on'绑定添加单击事件,即

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

请提供呈现的html并指定按钮(id、类等)的位置。如果您使用id=“opener”作为按钮,请尝试使用类,因为id应该是唯一的。
$(“#对话框”)。每个
,元素
id
必须是唯一的。改为使用类。添加了html,请帮助!!我想我从未见过如此破碎的HTML页面布局。。。您有10个
元素&至少两次重新包含所有资源…???当我这样做时,它会显示所有结果,但不会显示在对话框中。首先,当页面上有JST1元素时,我不明白你在做对话框循环。请使用以下脚本更新您的脚本,并在关闭body标记之前添加此脚本$(文档).ready(function(){$(“#dialog”).dialog({autoOpen:false,show:{effect:“blind”,duration:1000},hide:{effect:“explode”,duration:1000});$(“.opener”).live('click',function(){$(“#dialog”).dialog(“open”);});隐藏所有内容但仍然没有按钮点击任何按钮能否发布您页面的查看来源?