Javascript 在已经有onclick事件的情况下使用Fancybox jquery

我想点击放大链接打开我的fancybox

到目前为止，我拥有的是一个ajax调用，因此我可以根据项目的id填充我的图像：

...
xmlhttp.open("GET", "desciptionImageHelper.aspx?id=" + id, true);
...

在my DescriptionImageHelper.aspx上，我有一个查询，从中可以获得项目的所有图像：

while (reader.Read())
{
    litData.Text += "<a id='fancybox" + reader.GetInt32(0).ToString() + "' class='fancybox' rel='gallery1' onclick=\"javascript:imagePopup('" + reader.GetInt32(0).ToString() + "','" + reader.GetString(1) + "','" + reader.GetString(2) + "','" + reader.GetString(3) + "');\" ><img src=\"../helper/MediaImgHandler.ashx?imgid=" + reader.GetInt32(0).ToString() + "\"/></a>";
}

左键点击图片，我得到了你在图片中看到的这个框

代码是：

function imagePopup(id, title, media_type, format) {
        var popup = document.getElementById("imagePopup")
        popup.innerHTML = title + "<br /><span style='color:grey;margin-left:3px;'>" +
         media_type + " | " + format + "</span><br />" +
         "<a class='blueColor' onclick=\"javascript:getSummary(" + id + ",'m');" +
         "document.getElementById('projectNav').style.display = 'none';document.getElementById('left_right').style.display = 'none';displayMedia('" + title + "');$('#imagePopup').fadeOut('slow');\">SEE DETAILS</a><br />" +
         "<a id='enlarge' onclick=\"javascript:$('#fancybox" + id + "').attr('rel', 'gallery').fancybox();\" class='blueColor' >ENLARGE</a>";

        $('#imagePopup').css({ 'top': mouseY, 'left': mouseX }).fadeIn('slow');

    }

但它不是画廊，而且当我查看图片时，如果打开图片，它就会消失在我的页面上

我不知道该怎么办。 我的代码乱七八糟吗？我是否应该遵循其他策略？

imagePopup函数中的这一行：

"<a id='enlarge' onclick=\"javascript:$('#fancybox" + id + "').attr('rel', 'gallery').fancybox();\" class='blueColor' >ENLARGE</a>";

imagePopup函数中的这一行：

"<a id='enlarge' onclick=\"javascript:$('#fancybox" + id + "').attr('rel', 'gallery').fancybox();\" class='blueColor' >ENLARGE</a>";

---

我终于想出了一个主意，隐藏与.fancybox类的链接，并在单击放大时触发它

while (reader.Read())
{
       litData.Text += "<a onclick=\"javascript:imagePopup('" + reader.GetInt32(0).ToString() + "','" + reader.GetString(1) + "','" + reader.GetString(2) + "','" + reader.GetString(3) + "');\" ><img src=\"../helper/MediaImgHandler.ashx?imgid=" + reader.GetInt32(0).ToString() + "\"/></a>";
       litData.Text += "<a style='display:none' id='fancybox" + reader.GetInt32(0).ToString() + "' class='fancybox' rel='gallery1' title='asdsad' href=\"../helper/MediaImgHandler.ashx?imgid=" + reader.GetInt32(0).ToString() + "\" ></a>";
}

因此，对于一个链接，我有一个用于弹出窗口的onclick事件处理程序，对于另一个链接，我有我的href=../.ashx

 <a id='enlarge' onclick=\"javascript:$('#fancybox" + id + "').trigger('click');\" class='blueColor' >ENLARGE</a>

但我必须解决的另一个问题是，图像是通过helper.ashx显示的。

---

我通过在fancybox上添加属性“type”：“image”解决了这个问题

我终于想出了一个主意，隐藏与.fancybox类的链接，并单击放大按钮触发它

while (reader.Read())
{
       litData.Text += "<a onclick=\"javascript:imagePopup('" + reader.GetInt32(0).ToString() + "','" + reader.GetString(1) + "','" + reader.GetString(2) + "','" + reader.GetString(3) + "');\" ><img src=\"../helper/MediaImgHandler.ashx?imgid=" + reader.GetInt32(0).ToString() + "\"/></a>";
       litData.Text += "<a style='display:none' id='fancybox" + reader.GetInt32(0).ToString() + "' class='fancybox' rel='gallery1' title='asdsad' href=\"../helper/MediaImgHandler.ashx?imgid=" + reader.GetInt32(0).ToString() + "\" ></a>";
}

因此，对于一个链接，我有一个用于弹出窗口的onclick事件处理程序，对于另一个链接，我有我的href=../.ashx

 <a id='enlarge' onclick=\"javascript:$('#fancybox" + id + "').trigger('click');\" class='blueColor' >ENLARGE</a>

但我必须解决的另一个问题是，图像是通过helper.ashx显示的。

---

我通过在fancybox上添加属性“type”：“image”解决了这个问题

我从这里拿走的：我从这里拿走的：当然。。。我们错过了那里的天气。。。我看到你刚刚发布了你的html。为什么不在while循环中构建href，并将id、title、media\u type、format作为单独的属性，而不是在onclick属性中。。。因为即使你能让它像那样工作，你也永远得不到画廊。我将编辑我的答案。我尝试使用href，但单击它会将我带到一个单独的页面，仅显示图像！我必须用另一种方法吗？当然。。。我们错过了那里的天气。。。我看到你刚刚发布了你的html。为什么不在while循环中构建href，并将id、title、media\u type、format作为单独的属性，而不是在onclick属性中。。。因为即使你能让它像那样工作，你也永远得不到画廊。我将编辑我的答案。我尝试使用href，但单击它会将我带到一个单独的页面，仅显示图像！我必须用另一种方式吗？