Question

我在网上为jQuery Dialog找到了一些jQuery代码，效果很好。我遇到的问题是，当我单击链接图像打开对话框时，它会打开，但如果我关闭对话框并再次单击链接图像，它将不会重新打开jQuery对话框。

这是jQuery代码：

$(document).ready(function(){
       $('#gravatarprofilemoreinfoshow').click(function(){
           $('#gravatarprofilemoreinfo').dialog({
               modal:true,
               resizable: false,
               draggable: true,
               width: '486px',
               height: 'auto',
               hide: 'size',
               autoOpen: true,
               buttons:{ "Close": function() { $(this).dialog("close"); } },
               close: function(ev, ui) { $(this).remove(); }
           });
       });
   });

HTML标记是：

<a href="#" id="gravatarprofilemoreinfoshow" rel="/somelink" >
<img class="profileimgright profileimgframe" alt="Profile Image" src="/url/to/image" />
</a>

如何调整代码？还有一种方法可以改变代码，因此它不依赖于唯一的ID吗？

我问的原因是我想在我的网站上使用上面的jQuery代码来显示不同的信息，但上面的代码需要一个唯一的名称（抱歉不确定他们在jQuery中称之为什么）并希望代码可以重复使用我的网站。

Answer 1

您应该删除该行

close: function(ev, ui) { $(this).remove(); }

问题是它会在关闭后删除对话框和内容，因此您无法在第二次单击时使用它。看看jQuery Remove

此外，要重复使用此代码，您可以执行以下操作。声明Registers Dialog On Click的方法。此方法将传递图像和对话框的选择器

function registerDialogOnImageClick($image, $dialog){
      $image.click(function(){
           $dialog.dialog({
               modal:true,
               resizable: false,
               draggable: true,
               width: '486px',
               height: 'auto',
               hide: 'size',
               autoOpen: true,
               buttons:{ "Close": function() { $(this).dialog("close"); } },
           });
       });
   }

可以从任何地方调用此代码，传递图像和对话框的选择器

$(document).ready(function(){
   registerDialogOnImageClick($('#gravatarprofilemoreinfoshow'), $('#gravatarprofilemoreinfo');
});

jQuery对话框打开（不止一次）？

1 个答案: