Question

我正在尝试使用thickbox创建一个隐藏内容的模态窗口它打开窗口很好，不确定它是不是在id =“hiddencontent”中显示内容。

我按照内联http://jquery.com/demo/thickbox/#示例中的建议进行操作 -Thanks

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="thickbox.js"></script>

<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />
</head>

<body>
<a href="#TB_inline?height=155&width=300&inlineId=hiddenContent" class="thickbox">Show Content</a> 

<div id="hiddenContent" style="display: none">inline content comes here</div> 
</body>
</html>

Answer 1

您似乎没有css文件，可以将http://jquery.com/demo/thickbox/#sectiona-3上的thickbox css复制到您的页面（或另存为style.css文件）。

- 编辑 - 是的，抱歉，没有注意到css已经加载:(

顺便说一下，刚找到解决方案，尝试在hiddenContent div中添加p标签：

<div id="hiddenContent" style="display: none"><p>inline content comes here</p></div>

希望有所帮助;）

Answer 2

这是thickbox中的一个错误。以下是解决问题的方法：

在thickbox.js里面

在221行或左右，你应该看到这行代码：

$("#TB_ajaxContent").append($('#'+params['inlineId']).children());

将其更改为：

$("#TB_ajaxContent").html($('#'+params['inlineId']).html())

然后，在223行或左右，你会看到这一行：

$('#'+params['inlineId']).append($("#TB_ajaxContent").children());

通过在此之前添加两个斜杠来禁用该行：

//$('#'+params['inlineId']).append($("#TB_ajaxContent").children());

说明：

当thickbox将隐藏div中的内容复制到thickbox容器中时，它会通过复制所有.children（）元素来实现。如果您的隐藏div中只有文本，则没有儿童，因为文本本身不是子元素。这就是为什么将您的内容包装在<p>代码中的原因，因为现在有一个孩子（<p>代码）。

因此，如果您希望仅使用.html()在隐藏的div中添加文字，则会抓取隐藏div中的所有内容。禁用第二行可防止thickbox在厚盒关闭时尝试将内容复制回隐藏的div，这会导致子标记内的任何内容在隐藏的div中重复。

Answer 3

无需编辑.js文件，解决方案非常简单。

也许稍晚一点:)但我克服了这个问题，只更改? #TB_inline?中的&字符{/ 1}}

问题出现在内部parseQuery复选框功能上，它解析匹配对，但是当查询在这种情况下有一个双?时就会出现问题。

更新：在某些情况下，还需要修复<p>;）

希望它有所帮助。

Answer 4

需要更新函数tb_position（）。

这种情况

if（！（jQuery.browser.msie＆amp;＆amp; jQuery.browser.version＆lt; 7））

是错误的原因。

jQuery不再支持jQuery.browser了。在这种情况下，为了检测IE6，请将上述条件更改为

if（！（/ \ bMSIE 6 / .test（navigator.userAgent）））

Thickbox内联问题

4 个答案: