我正在尝试使用动态ID控制按钮
$ num表示按钮数
但是此代码无法正常工作,因为在退出循环时,单击$ i时,变量$ i将具有相同的值:
我怎样才能解决这个问题 ?

$(document).ready(function(){
    $num=("#num").attr("value");
    for ($i=0;$i<=$num;$i++){
    $("#createNew"+$i).click(function(){
        $("#j"+$i).hide();
        $("#cNew"+$i).slideToggle(1000);
    });
    $("#join"+i).click(function(){
        $("#cNew"+$i).hide();
        $("#j"+$i).slideToggle(1000);
    });
    }
});


的PHP代码:

while ($row=mysqli_fetch_array($result1)){
      echo "<div class=\"well project\">";
      echo"<h1 id=\"course\">".$row['courseID']." </h1></br>";
      echo "<p>".$row['description']."</p></br></br>";
      echo "<input type=\"button\" class=\"btn btn-default bt\" id=\"createNew\"value=\"create new\" >";
      echo "<input type=\"button \" class=\"btn btn-default bt\" id=\"join\" value=\"join\">";
      echo "<div id=\"cNew".$i."\" style=\"display:none\"></br><form method=\"POST\" action=\"createNewProject.php?reg=".$row['regID']."\" ><label for=\"title\" >Project title</label><input type=\"textbox\" class=\"form-control\" name=\"title\"></br><label for =\" Pdescription\">description</label><textarea name=\"Pdescription\" class=\"form-control\"></textarea></br> <input type=\"submit\" vlaue=\"create\" class=\"btn btn-default bt\" ></form></div>";

      echo"</br></br><div id=\"j".$i."\" style=\"display:none\"><form method=\"post\"  action=\"joinProject.php?reg=".$row['regID']."\"><label for=\"pId\">Enter the project ID</label><input type=\"textbox\" class=\"form-control\" name=\"pId\"></br> <input type=\"submit\"  value=\"Send requst\" class=\"btn btn-default bt\"></br></form></div>";
      echo "</div>";
      $i++;
  }
  }
  else
      echo"<div class=\"well project\"><h1>No new projects</h1></div>";
      echo "<input type=\"textbox\" id=\"num\" value=\"".$i."\" style=\"display:none\">";

最佳答案

最好仅为此使用事件委托。我们也可以将动态数字用作选择器的一部分。

$('body').on('click', '[id^="createNew"], [id^="join"]', function(){
    var id = $(this).prop('id').split('createNew')[1];
    $('#j'+id).hide();
    $('#cNew'+id).slideToggle(1000);
});

$('body').on('click', '[id^="join"]', function(){
    var id = $(this).prop('id').split('join')[1];
    $('#cNew'+id).hide();
    $('#j'+id).slideToggle(1000);
});


该实现将起作用something like this:

10-05 20:46
查看更多