Question

我想在链接点击时显示jquery对话框，但是当我点击多个对话框时打开而不是一个。

我试过this但仍然无法正常工作。

如果我使用next（）方法，则不会打开任何对话框，因为您可以阅读上面的链接。

我认为我应该使用数据属性，但我不知道如何使用它。

这是我的jqueryui对话框div内容在php while循环中：

while ($rows8 = $sql8->fetch_assoc()){

 echo "<div id='view-reply'>

  <span class='report_link'><a data-myid='$rows8[reply_id]' class='rp' href='javascript:void(0);'><img src='img/admin.png' alt='report to admin' title='report to admin'/></a></span>
										
  <div style='display: none;' class='post_reply_report_win'>
   <h4><span>Report to Admin</span><hr/></h4>
   <form class='reportForm' method='post' action='report_process.php?uid=".urlencode(base64_encode($rows8['reply_by']))."&p=".urlencode(base64_encode($rows8['reply_to_post']))." '>
    <p><span>Subject</span><br/>
    <input type='text' name='reporttxt' maxlength='100' required autofocus /></p>
    <p><span>Details</span><br/>
    <textarea name='reportarea' maxlength='500' required ></textarea></p>
    <p><input type='submit' name='reportsub' id='sub' value='Submit'/></p>
   </form>
  </div>
 </div>
}

我正在显示它：

$(document).ready(function(){

  $(".post_reply_report_win").dialog({
							
		modal	:	true,
		draggable	:	false,
		resizable	:	false,
		autoOpen	:	false, 
		buttons:	[
						{ 
							text: "Cancel", 
							click: function () { 	
								$(this).dialog("close");	
							},
							style: "outline: none;"	
						}
					],
		close	:	function(event, ui){
						$(this).dialog("close");
					}			
			
	});
  
  
  $("#view-reply .report_link a").click(function() { 
	
			$(".post_reply_report_win").dialog("open");
				
			return false;
	});


});

Answer 1

您的点击监听器简单地打开它们，因为它们都有类！

$(".post_reply_report_win").dialog("open");

您需要具有用于打开对话框的唯一标识符。作业可以按班级完成。所以我会这样：

为此行<div style='display: none;' class='post_reply_report_win'>添加一个唯一ID，如<div style='display: none;' class='post_reply_report_win' id='post_reply_report_dialog_<?echo $i;?>＆＃39;;

$ i将在你的循环中以1和$ i ++开头。

然后，您的侦听器应该使用来自jquery的.closest（）来查找最接近的.post_reply_report_win元素并从中获取id。该id是您传递给对话框的.open调用的那个。

$('#'+$(this).closest('.post_reply_report_win').attr('id')).dialog("open");

Answer 2

id应该是唯一的。 id='view-reply'在循环中，并且正在重复。

尝试以下代码：

 $(".report_link a").click(function() { 

          $(this).parent('.report_link').next('.post_reply_report_win').dialog("open");

          return false;
});

Answer 3

经过长时间的研究，我自己解决了这个问题。

我在这里发布我的解决方案只是为了帮助那些也在寻找解决方案的人:)

所以这是解决方案：

PHP：

while ($rows8 = $sql8->fetch_assoc()){

  echo "<span class='post_reply_report_link'><a data-myid='$rows8[reply_id]' class='rp' href='javascript:void(0);'><img src='img/admin.png' alt='report to admin' title='report abuse'/></a></span>
										
  <div class='post_reply_report_win_$rows8[reply_id]' id='post_reply_report_win' >
   <h4><span>Report Abuse</span><hr/></h4>
   <form class='post_reply_report_form' method='post' action='report_process.php?uid=".urlencode(base64_encode($rows8['reply_by']))."&p=".urlencode(base64_encode($rows8['reply_to_post']))." '>
    <p><span>Subject</span><br/>
    <input type='text' name='reporttxt' maxlength='100' required autofocus /></p>
    <p><span>Details</span><br/>
    <textarea name='reportarea' maxlength='500' required ></textarea></p>
    <p><input type='submit' name='reportsub' id='sub' value='Submit'/></p>
   </form>
  </div>";

}

的javascript：

$(document).ready(function(){

$(".post_reply_report_link a").click(function() { 
	
 var myID = $(this).attr("data-myid");
				
			$(".post_reply_report_win_"+myID).dialog({	
				
				modal	:	true,
				draggable	:	false,
				resizable	:	false,
				buttons:	[
								{ 
									text: "Cancel", 
									click: function () { 	
												$(this).dialog("close");	
											},
									style: "outline: none;"	
								}
							],
				close	:	function(event, ui){
								$(this).dialog("close");
							}			
				
	
			});

});

php内的jqueryui对话框，而循环未按预期打开

3 个答案: