【问题标题】:How to create individual IDs in a PHP loop如何在 PHP 循环中创建单独的 ID
【发布时间】:2017-07-27 23:52:16
【问题描述】:

我开发了一个 PHP 循环,它每天为我数据库中的每个用户创建一个注册表单。每个表单都有一个包含各种下拉列表的 div,它直接放置在一个显示当天提交内容的 div 上。选择一个下拉框时,我使用jQuery使顶部DIV消失并在下面的DIV上显示答案。如果出现错误,则会有一个重置按钮,将 x 放入数据库。

我还创建了一个 PHP 查询,用于查找每个用户每天的最新输入(无论是 x 还是他们当天注册的内容)。然后将其回显到顶部 div 的 div 中(我使用 CSS 隐藏它)。

我想要发生的是,当有人加载页面时,它将显示当天已经注册的人。我想通过一个函数来隐藏字符串长度大于 2 的任何人的顶部 div 来做到这一点。我已经尝试了多种方法来做到这一点,但无法让任何工作。有没有办法创建唯一的 id,然后将它们传输到 jQuery?

我附上了下面代码的简化版本,它显示了我到目前为止所拥有的内容。任何帮助将不胜感激。

我尝试过使用计数器,但我认为我使用错了。任何人都可以看到如何解决它,以便我可以调用唯一 ID?这是我尝试过的脚本。

<script>
$(document).ready(function() {
if ($("#needed<?= $i ?>").text().length > 3) {
$("#needed<?= $i ?>").parentsUntil(".submitted").addClass("hidediv");
$("#needed<?= $i ?>").parentsUntil(".submitted").removeClass("showdiv");
}
});

<!DOCTYPE html>

<html>

<head>
<?php include 'dbconnection.php'; ?>


<link href="hidphptest.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" 
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>



<script>
$(document).ready(function(){
$(".cars").change(function(){
   $(this).parentsUntil(".submitted").addClass("hidediv");
    $(this).parentsUntil(".submitted").removeClass("showdiv");
});
});



</script>



<script>
$(document).ready(function(){
$(".go45").click(function(){
        $(this).siblings().addClass("showdiv");
    $(this).siblings().removeClass("hidediv");

});
});


</script>

<script>
$(document).ready(function() {
if ($("#needed<?= $i ?>").text().length > 3) {
$("#needed<?= $i ?>").parentsUntil(".submitted").addClass("hidediv");
$("#needed<?= $i ?>").parentsUntil(".submitted").removeClass("showdiv");
}
});
</script>
<body>

<br>


<form  method="post" action="testplace3.php">
<select name="classu" >
<option  disabled="disabled" selected="selected">Select Class</option>
    <?php
$selectclass=$connect->query("SELECT DISTINCT class FROM `firstnametest` ");
while($rows=$selectclass->fetch_array())
{
 ?>
<option value="<?php echo $rows['class']; ?>"><?php echo $rows['class']; ?>            
</option>
<?php
}
?>



<input type="submit" value="Add Group" style="width: 317px; height: 45px"/>    

</select>
</form> 

<?php




$query=mysqli_query($connect,"SELECT * from firstnametest where class =     
'group1'" );
// Initiate  counter variable
$i = 1;
while ($row=mysqli_fetch_array($query))
{
?>






<div class="submitted ">
<button id="butest" type="button"   class="go45 btn btn-info " value="<?php          
echo$row["id"];   ?>">Go Back</button>
<div class="todo "><br><span id="needed<?= $i ?>"><?php      
 echo$row["surname"];   ?></span><br>




<select  class="cars" >
<option  disabled="disabled" selected="selected">Group </option>
<option value="Group 1">Group 1</option>
<option value="Group 2">Group 2</option>
<option value="Group 3">Group 3</option>
<option value="Group 4">Group 4</option>
</select>




<br>  
<div >

</div> 
</div>
</div>
<!-- Counter increment -->

<?php
$i++;
}

?>

</body>

</html>

【问题讨论】:

  • $i 在哪里设置或更新?
  • 为什么你认为你实施错了?与期望的行为相反,您观察到的行为是什么?
  • 您永远不会将$groupder 设置为任何内容,如果您设置了,您很可能容易受到SQL injection 攻击。您应该通过mysqliPDO 驱动程序使用带有绑定参数的准备好的语句。 This post 有一些很好的例子。
  • 在加载页面时,如果文本字符串超过 3 个字符,我希望它隐藏第一个 div。我已经在我开始计数器的地方发表了评论 - // 启动计数器变量 $i = 1;以及它在哪里增加
  • 与其尝试使用不同的 id 并循环遍历它们,只需将这些元素中的每一个分配给相同的类,然后在 javascript 中您可以执行类似 $(".someclass").each(function(){ if($(this).text().length &gt; 3) { ...add/remove class... }}); 的操作

标签: javascript php jquery html css


【解决方案1】:

如果我没看错,就是你的脚本有问题。

<script>
$(document).ready(function() {
  if ($("#needed<?= $i ?>").text().length > 3) {
    $("#needed<?= $i ?>").parentsUntil(".submitted").addClass("hidediv");
    $("#needed<?= $i ?>").parentsUntil(".submitted").removeClass("showdiv");
}
});
</script>

我不知道$(document).ready(function() 位是如何工作的,但是您正在创建的代码有一个#needed,因为当PHP 生成页面时$i 为空。所以我猜它只适用于#needed div。您可能需要遍历所有 div 并将它们全部隐藏在 function() 中。

【讨论】:

  • $i=1 脚本开始时,然后每次迭代递增
  • 我知道这是你想要的,但是这段代码只在页面生成时编写一次,php 只在页面创建时运行。加载后查看您的 HTML 源代码。
猜你喜欢
  • 1970-01-01
  • 2014-06-19
  • 2018-12-02
  • 2020-01-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-08-30
  • 1970-01-01
相关资源
最近更新 更多