javascript - 为什么 Colorbox 不适用于点击事件？

Question

我正在使用Colorbox在我的应用程序中。我正在寻找的是，在页面加载时隐藏 div (.box)，当我单击链接时，它会打开 (div.box) 并显示它的标题 (My Box) 和样式。

<div class="click" href="link">Click here!</div>

<div class="box" style="width:700; height:800;" title="My Box">
    <p>Content goes here</p>
</div>

这是我尝试过的。

<script>
  $(document).ready(function () {
    $('.box').hide();
    $('.click').click(function () {

            open_colorbox(newWidth, newHeight, newTitle);
      });

    function open_colorbox(c_width, c_height, c_title) {
     var options = {
       width: c_width,
       height: c_height,
       title: c_title,
       overlayClose: false
     };
     $.colorbox(options);
    }
  });
  </script>

上述解决方案不起作用。我在这里缺少什么？

更新 1:

根据以下评论和答案，我只使用一行来打开 colorbox，但仍然无法工作!!!

<script>
  $(document).ready(function () {
    $('.box').hide();
    $('.click').click(function () {
       $(".box").colorbox({ open: true });
     });
  });
</script>

更新2:

感谢@Franklin。他的解决方案是正确的。这是一个如何完成简单 Colorbox 的示例。 http://codepen.io/egyamado/pen/Jnxvi

Answer 1

在你的点击函数中，你不能做...

尝试添加div的#id

    $(".box").colorbox({href:"#id", inline:true});

或者

$("a.click").colorbox({href:"#id", inline:true});