Colorbox 关闭事件在 Safari 上没有响应答案

【问题标题】：Colorbox Close Event not responding on SafariColorbox 关闭事件在 Safari 上没有响应
【发布时间】：2013-08-18 19:38:29
【问题描述】：

我有颜色框实现，点击 URL（在颜色框内）应该关闭颜色框本身。下面是代码：

HTML 单击 URL 会打开图像的颜色框。

<link rel="stylesheet" href="colorbox.css" type="text/css" media="all" /> 
<script src="jquery-1.8.3.min.js" type="text/javascript">
</script>
<script src="jquery.colorbox-min.js" type="text/javascript"></script>

<script>
$(function() {
$('.colorbox-link').colorbox({
        transition: "none",
        opacity: 0.4,
        onComplete: function(){
            $.colorbox.resize();
        },
        speed: 300,
        width: 530,
        initialWidth: "530",
        innerWidth: 530,
        maxWidth: 530,
        height:false,
        initialHeight: "400",
        innerHeight: false,
        maxHeight: false,
        preloading:false

    });     
});
</script>

<a id="Preview1" href="openpopup.php" class="colorbox-link">Preview</a>

POPUP/COLORBOX 在点击预览 URL 时打开

<link rel="stylesheet" href="colorbox.css" type="text/css" media="all" />
<script src="jquery-1.8.3.min.js" type="text/javascript">
</script>

<script src="jquery.colorbox-min.js" type="text/javascript">
</script>


<script>
  $(document).ready(function () {

    $('#change').click(function(){

        $('#cboxClose').click();
    });

  });
</script>
<div class="popup-shell">
  <div class="modal-header"> <i id="close-icon" class="icon-close close-trigger"> </i>
    <h2 class="page-title"> Preview Your File </h2>
  </div>
  <div class="popup-body">
    <div class="popup-image-holder"> <a class="demo" href=""> <img src="personal.jpg" /> </a> </div>
  </div>  
  <div class="modal-footer">
    <p class="buttons-small"> <a id="accept" href="javascript:;"> accept </a> <a href="javascript:;" id="change"> change </a> </p>
  </div>
</div>

现在在颜色框/弹出窗口中，点击哪个颜色框应该关闭一个链接“更改”，但它没有...它在除 SAFARI 之外的所有其他浏览器中都可以正常工作

Demo URL 可以在其中找到应用程序。请在 Safari 中查看。

【问题讨论】：

您的更改锚标记没有 ID change。
谢谢@kayen，但这只是在这里写的一个错字......问题并不能通过更正来解决。
@Amith 但是那只会刷新页面，这是我不想发生的事情

标签： javascript jquery colorbox

【解决方案1】：

我敢打赌，点击事件并没有真正绑定到元素。尝试使用live将点击事件绑定到元素：

$('body').live('click', '#change' , function(){
    $('#cboxClose').click();
    //or $.colorbox.close()

});

【讨论】：

【解决方案2】：

我猜你不需要<a> 标签，因为你正在使用 jquery 将事件附加到它。试试这个

<div class="modal-footer">
    <p class="buttons-small">
       <input type ="button" value ="accept" id="accept" />
       <input type ="button" value ="change" id="change" /> 
    </p>
</div>

【讨论】：

标签不是问题老哥，问题是colorbox的关闭事件。
为什么它没有关闭，因为您正在使用 href 并尝试将事件绑定到它。由于 href 有默认的点击事件，它不会工作。所以最好尝试使用按钮