Php 在使用循环时，除了第一个项目外，所有项目都会丢失jQuery功能
在下一页中，开始一个元素，使用户可以裁剪和保存图像。它只适用于循环中的第一项，但是，对于后面的所有sql行，单击图像不会打开模式对话框 我没有任何重叠的标签，我已经彻底检查过了。我已经移动了js脚本标记，也没有得到任何更改。这有共同的原因吗？哪里是第一个进行故障排除的地方？在PHP中使用不同类型的循环会更好吗Php 在使用循环时，除了第一个项目外，所有项目都会丢失jQuery功能,php,jquery,twitter-bootstrap,loops,modal-dialog,Php,Jquery,Twitter Bootstrap,Loops,Modal Dialog,在下一页中，开始一个元素，使用户可以裁剪和保存图像。它只适用于循环中的第一项，但是，对于后面的所有sql行，单击图像不会打开模式对话框 我没有任何重叠的标签，我已经彻底检查过了。我已经移动了js脚本标记，也没有得到任何更改。这有共同的原因吗？哪里是第一个进行故障排除的地方？在PHP中使用不同类型的循环会更好吗 <?php ob_start(); session_start(); require_once ('verify.php'); ?
<?php
ob_start();
session_start();
require_once ('verify.php');
?>
<head>
<title>Edit Listings</title>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<link href="../css/cropper.min.css" rel="stylesheet">
<link href="../css/crop-avatar.css" rel="stylesheet">
</head>
<body>
<div id="container">
<div id="head">
<ul id="menu">
</ul>
</div>
<div id="area"></div>
<div id="main_listings">
<h1 align="left">Edit listings page</h1>
<?php
include ("../dbcon2.php");
$conn = new mysqli($servername, $username, $password, $dbname);
$sql="SELECT * FROM listings ORDER BY date_added DESC";
$result = $conn->query($sql);
?>
<?php while ($data=mysqli_fetch_assoc($result)):
$id = $data['id'];
$id = $data['title'];
$listing_img = $data['listing_img'];
?>
<div id="edit_listing">
<div id="edit_left">
<div class="container" id="crop-avatar">
<div class="avatar-view" title="Change the avatar"> <img src="<?php echo $listing_img; ?>" alt="<?php echo $title; ?>"> </div>
<div class="modal fade" id="avatar-modal" tabindex="-1" role="dialog" aria-labelledby="avatar-modal-label" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form class="avatar-form" method="post" action="edit-avatar.php" enctype="multipart/form-data">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title" id="avatar-modal-label">Listing Main Image</h4>
</div>
<div class="modal-body">
<div class="avatar-body">
<div class="avatar-upload">
<input class="avatar-src" name="avatar_src" type="hidden">
<input class="avatar-data" name="avatar_data" type="hidden">
<input name="avatar_id" type="hidden" value="<?php echo $id; ?>">
<label for="avatarInput">Local upload</label>
<input class="avatar-input" id="avatarInput" name="avatar_file" type="file">
</div>
<div class="row">
<div class="col-md-9">
<div class="avatar-wrapper"></div>
</div>
<div class="col-md-3">
<div class="avatar-preview preview-lg"></div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-default" type="button" data-dismiss="modal">Close</button>
<button class="btn btn-primary avatar-save" type="submit">Save</button>
</div>
</form>
</div>
</div>
</div>
<div class="loading" tabindex="-1" role="img" aria-label="Loading"></div>
</div>
</div>
<div id="edit_right">
<form name="edit_date" action="edit_list.php" method="post" id="edit_list_data">
<input name="title" type="text" id="title" tabindex="1" value="<?php echo $title; ?>" size="60" maxlength="57"/>
<input type="hidden" name="id" value="<?php echo $id; ?>" />
<input type="submit" formaction="edit_list.php" value="Submit" />
</form>
</div>
</div>
<?php endwhile;$conn->close();?>
<div class="spacer"></div>
</div>
</div>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="../js/cropper.min.js"></script>
<script src="../js/crop-avatar.js"></script>
</body>
</html><?php // Flush the buffered output.
ob_end_flush();
?>
问题的根源是双重的（这背后可能还有其他问题） 首先，HTML中有大量重复的id值 下面是一些DUP：
编辑列表容器编辑左裁剪化身化身模式new CropAvatar($("#crop-avatar"));
<div class="container crop-avatar">
$(".crop-avatar").each(function() {
new CropAvatar($(this));
});
CropAvatar（）这是我看到的前两个主要问题。我不能保证没有其他问题需要解决，但在前两个问题得到解决之前，这些问题是看不见的。所以，这是HTML，但您实际询问的jQuery代码在哪里？我不是问jQuery本身。我在问你自己编写的自定义Javascript。你指的这个循环在哪里？我们需要您实际询问的Javascript/jQuery循环的代码。如果您想评估PHP循环的结果，请使用View/Source并在浏览器中查看生成的HTML（例如PHP的结果）。如果您想帮助理解为什么在浏览器中单击某个东西不会触发JS事件处理程序，那么我们必须查看生成的HTML的代表性样本和连接事件处理程序的JS代码。如果您不清楚，PHP只在服务器上运行。它的工作是生成页面。然后，该页面被传递到浏览器，单击仅在浏览器中处理。模式不在来自服务器的页面源中。它是由页面上的一些javascript动态生成的。您可以在任何浏览器调试器中使用DOM检查器查看它，但我不知道为什么这对您很重要。您的问题可能与连接点击事件处理程序的javascript代码有关。我没有看到在您包含的JS代码中安装任何点击处理程序。
var example = new CropAvatar($("#crop-avatar"));
$(".crop-avatar").each(function() {
new CropAvatar($(this));
});