Question

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

HTML点击网址时，会打开图片的ColorBox。

<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

<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>

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

Demo URL您可以在哪里找到该应用程序。请在Safari中查看。

Answer 1

我想你不需要<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>

Answer 2

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

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

});

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

2 个答案: