当有人点击图片时,我们使用jQuery thickbox动态显示iframe.在这个iframe中,我们使用galleria一个javascript库来显示多张图片.
问题似乎是$(document).ready在iframe似乎过早被解雇并且iframe内容甚至尚未加载,因此galleria代码未在DOM元素上正确应用. $(document).ready似乎使用iframe父就绪状态来决定iframe是否准备就绪.
如果我们在单独的函数中提取由文档就绪调用的函数,并在超过100毫秒后调用它.它有效,但我们不能利用慢速计算机生产机会.
$(document).ready(function() { setTimeout(ApplyGalleria, 100); });
我的问题:我们应该绑定哪个jQuery事件,以便在动态iframe准备就绪时能够执行我们的代码,而不仅仅是它的父级？
我有一个问题,通过jQuery伪造一个锚点击:为什么我的厚箱出现在我第一次点击输入按钮,但不是第二次或第三次？
这是我的代码:
<input onclick="$('#thickboxId').click();" type="button" value="Click me" />
<a id="thickboxId" href="myScript.php" class="thickbox" title="">Link</a>
当我直接点击链接时,它总是有效,但如果我尝试通过输入按钮激活厚箱,则无效.这是在FF.对于Chrome,它似乎每次都有效.任何提示？
我使用JQuery ThickBox 3.1将我的Iframed内容显示为弹出窗口.
<a href="popUp.aspx?id=<%#Eval("id")%>&TB_iframe=true&height=600&width=800"
title='<%#Eval("Title")%>' class="thickbox">
<img id="thumbnailImage" runat="server" src='<%#Eval("ImagePath")%>'
alt="Single Image" width="180" style="max-height:220px"/></a></div>
当我点击'thumbnailImage'时,页面'popUp.aspx'将显示为弹出窗口.
如你所见,我给出了弹出窗口的大小height=600&width=800",
但我有一个表(宽度:自动),因此我的表的宽度可能会动态变化!
我想知道如何设置thickBox的宽度和高度的值auto.
你可以看到thickBox的css文件和javascript文件!
哪一个最适合用于:
这是场景:
我在网页上有一个文本框和一个按钮.单击该按钮时,我想要打开一个弹出窗口(使用Thickbox),该窗口将显示与文本框中输入的值匹配的所有项目.我目前正在使用Thickbox的IFrame实现.问题是要显示的URL被硬编码到按钮的"alt"属性中.我真正需要的是"alt"属性将文本框中的值传递给弹出窗口.
这是迄今为止的代码:
<input type="textbox" id="tb" />
<input alt="Search.aspx?KeepThis=true&TB_iframe=true&height=500&width=700" class="thickbox" title="Search" type="button" value="Search" />
理想情况下,我想将文本框值放入Search.aspx网址,但我似乎无法弄清楚如何做到这一点.我目前的替代方法是使用jQuery设置"搜索"按钮的单击功能,以调用将在ASP.NET会话中设置某些值的Web服务.然后,Search.aspx页面将使用会话变量进行搜索.但是,这有点不稳定,因为在设置会话变量之前似乎总是存在搜索执行的可能性.
如何使用javascript函数调用thickbox.我正在使用此代码.
//javascript function
function click_fn()
{
self.location="upload.php?keepThis=true&TB_iframe=1&width=1000&height=400&model=true";
}
这个问题与Wordpress有半个相关,但在其他地方也有应用.基本上,我试图这样做,当有人退出Thickbox时,它会触发页面上其他地方的事件.编辑Thickbox文件不是一个选项.
我正在使用ThickBox在我的页面中打开弹出窗口.在弹出窗口中有一个单击选项卡,我需要更改ThickBox弹出窗口的大小.我怎样才能做到这一点 ？
提前致谢.
点击链接时我正在调用thickbox:
<a href="createContact.aspx?placeValuesBeforeTB_=savedValues&TB_iframe=true&height=400&width=550&modal=true"
title="Add a new Contact" class="thickbox">Add a new Contact</a>
并且,当单击服务器按钮时,我调用此javascript函数来显示jGrowl通知:
ScriptManager.RegisterClientScriptBlock(this, typeof(Page), Guid.NewGuid().ToString(), "$(function(){$.jGrowl('No Contact found: " + searchContactText.Text + "');});", true);
两者都按预期工作,除非首先显示jGrowl而不是厚盒.这将导致厚箱无法工作,页面将显示为普通网页(就像厚箱已经消失一样).
有谁知道发生了什么？
更新:这是没有母版页的测试页面:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="RoutingPortal.Presentation.WebForm2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="../Scripts/jquery-1.6.2.js" type="text/javascript"></script>
<script src="../Scripts/jquery-ui-1.8.16.custom.min.js" type="text/javascript"></script>
<script src="../Scripts/thickbox.js" type="text/javascript"></script>
<script src="../Scripts/jquery.jgrowl.js" type="text/javascript"></script>
<link href="../Scripts/css/jquery.jgrowl.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="~/CSS/thickbox.css" type="text/css" media="screen" />
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel …我正在使用一个名为Thickbox.js的 jQuery 弹出库。
我的页面上有一张小图片。当用户单击此图像时，会调用某个函数，thickbox.js 库会动态创建用于弹出窗口的 HTML/CSS 并显示弹出窗口。
这里要注意的最重要的事情是，如果在显示弹出窗口时查看页面的 HTML 源代码，我将看不到弹出窗口的 HTML 代码。我尝试通过 Firebug 控制台查看弹出窗口的 HTML 源代码，方法是检查该元素，然后我可以看到弹出窗口的 HTML 源代码。这表明该DOM不包含弹出框的HTML代码。
现在我的问题是，如果用户单击弹出区域以外的页面上的任何位置，我想关闭此打开的弹出窗口。我尝试了一些代码，但不幸的是他们无法做我想做的事情。现在我对这个问题简直一无所知。以下是代码供您参考：
<a href="#" onclick="return $Core.box('prj_name.contactform', 400);">
<!-- This is the function call which generates the pop-up HTML on the fly -->
<img width="33" height="89" align="middle" border="0" pagespeed_url_hash="3893298907" alt="" src="http://58.189.67.789/theme/frontend/foxplus/style/default/image/layout/contact.jpeg">
</a>
以下是动态生成的弹出 HTML。我从 Firebug 控制台获取：
<div class="js_box_image_holder_full ">
<div id="js_box_id_3" class="js_box " style="width: 400px; top: 15%; left: 69%; margin-left: 0px; margin-top: 278px; z-index: 5003; display: block;">
<div class="js_box_title">Contact</div>
<div class="js_box_content">
<style type="text/css">#js-contact-message:after{content:'\1f603'}</style> …