1

更新:问题已解决:

由于在页面加载后创建了“有问题的”元素,因此事件委托确保所有这些元素都绑定到 jQuery 事件。

原帖:

我得到了这段代码:

while ($row=mysqli_fetch_array($res)){
    if($cont>3){
       $cont=1;
       $txt=$txt.'</tr><tr>';
    }
    $txt=$txt.'<td>'; 
    $txt=$txt.'<figure><img src="'.$row['picture'].'"/></figure>';
    $txt=$txt.'<figcaption>'.$row['pictureDesc'].'</figcaption>'; 
    $txt=$txt.'<div class="dialogInfoOpener" style="border:solid red 1px;">Details</div>'; 
    $txt=$txt.'</td>';    
    $cont++; 
}   
$txt=$txt.'</tr>';
echo $txt;

它是与 JS 文件 (Ajax) 一起工作的 PHP 文件的一部分,以便通过连接字符串来“构造”由 3 个单元格的行组成的表格。对于每个单元,从数据库中加载一些数据。每个单元格都放置一个div具有给定类( dialogInfoOpener) 和特定内联样式的 a。应该单击该div元素以打开一个 jquery 对话框 - 这是问题开始的地方。

我的对话框的代码:

HTML

<div id="dialogInfo" title="Product description">Info to be put in here.</div>

jQuery

$("#dialogInfo").dialog({ 
    autoOpen: false,
    buttons:[{
        text: "Close", click : 
        function(){
            $(this).dialog("close");
        }
    }]
});


$(".dialogInfoOpener").click(function(event){</s>
    $("#dialogInfo").dialog("open");</s>
});</s>

该代码适用dialogInfoOpener于页面上找到的任何具有类的元素,除了属于刚刚构建的表的任何元素。单击这些 div 时,它不会做任何事情(为每个单元格正确设置了类和样式属性)。jQuery 似乎没有响应给 div 的类名。为什么? div

我希望很清楚。

我将不胜感激任何有用的建议。

4

3 回答 3

1

由于这些元素是动态创建的,您可以使用事件委托,例如:

$(document).on("click", ".dialogInfoOpener", function(event){
    $(".dialogInfo").dialog("open");
});

通常有一个更好的选择器来使用document- 找到元素的一致父.dialogInfoOpener元素并使用它来代替。

另外,我认为您可能有错字 - 您的 HTML 提到了带有 的元素#dialogInfo,但在您使用的点击功能中.dialogInfo?请记住,ID 必须是唯一的,如果您有多个,只需使用一个类。

于 2014-03-10T21:56:10.803 回答
0

在 Ajax 调用完成后重新运行连接 click 事件的代码。尝试取消绑定/绑定,这样您就不会触发重复的事件。

于 2014-03-10T21:57:38.493 回答
0

你已经混合了 ID 和类。

$("#dialogInfo").dialog({使用 ID 但$(".dialogInfo").dialog("open");使用类。如果你使这些相同,你会修复它。

于 2014-03-10T21:58:23.557 回答