Javascript 无法从函数加载fancybox，但它在函数外部工作_Javascript_Php_Jquery_Fancybox

Javascript 无法从函数加载fancybox，但它在函数外部工作

javascript php jquery

Javascript 无法从函数加载fancybox，但它在函数外部工作,javascript,php,jquery,fancybox,Javascript,Php,Jquery,Fancybox,我试图通过单击加载fancybox，甚至在函数中也是如此。它将在javascript函数外部工作，但不会在函数内部工作例如：这在页面加载时起作用，并立即打开fancybox： $.fancybox.open({ width: 400, height: 400, autoSize: false, href: '/manager/users/edit/1', type: 'iframe' }); 如果我侦听单击事件，则该事件不起作用： $(docume

我试图通过单击加载fancybox，甚至在函数中也是如此。它将在javascript函数外部工作，但不会在函数内部工作

例如：这在页面加载时起作用，并立即打开fancybox：

$.fancybox.open({
    width: 400,
    height: 400,
    autoSize: false,
    href: '/manager/users/edit/1',
    type: 'iframe' 
});

如果我侦听单击事件，则该事件不起作用：

$(document).ready(function ()
{
    $('.edit_user').click( function() { 
        $.fancybox.open({
            width: 400,
            height: 400,
            autoSize: false,
            href: '/manager/users/edit/1',
            type: 'iframe' 
            });
    });
});

失败并返回的Onclick：

未捕获的TypeError:无法读取未定义的属性“open”

如果您有任何见解，我们将不胜感激

这个怎么样

    $(document).on('click', '.edit_user', function() { 
        $.fancybox.open({
            width: 400,
            height: 400,
            autoSize: false,
            href: '/manager/users/edit/1',
            type: 'iframe' 
            });
    });

或者取决于jquery的版本

    $('.edit_user').live('click', function() { 
        $.fancybox.open({
            width: 400,
            height: 400,
            autoSize: false,
            href: '/manager/users/edit/1',
            type: 'iframe' 
            });
    });

看起来好像jquery库版本的不同，在您引用之后，我尝试在本地实现它。它在点击事件中对我起了作用。这是我试过的代码

$(document).ready(function() {
        $("#clickme").click(function() {
                    $.fancybox.open({
                    width: 400,
                    height: 400,
                    autoSize: false,
                    href: 'index.html',
                    type: 'iframe' 
                });
            });
        });

完成我试过的代码

<!DOCTYPE html>
<html>
<head>
    <title>fancyBox Tryout</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="../lib/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="../source/jquery.fancybox.pack.js?v=2.1.5"></script>
    <link rel="stylesheet" type="text/css" href="../source/jquery.fancybox.css?v=2.1.5" media="screen" />
    <style type="text/css">
        .fancybox-custom .fancybox-skin {
            box-shadow: 0 0 50px #222;
        }

        body {
            max-width: 700px;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <h1>fancyBox <a href="javascript:void(0);" id="clickme">click</a></h1>

    <script type="text/javascript">
        $(document).ready(function() {
        $("#clickme").click(function() {
                    $.fancybox.open({
                    width: 400,
                    height: 400,
                    autoSize: false,
                    href: 'index.php',
                    type: 'iframe' 
                });
            });
        });
    </script>
</body>
</html>


fancyBox试用版
.fancybox定制。fancybox皮肤{
盒影：050px#222；
}
身体{
最大宽度：700px；
保证金：0自动；
}
幻想箱
$（文档）.ready（函数（）{
$（“#单击我”）。单击（函数（）{
$.fancybox.open({
宽度：400，
身高：400，
自动调整大小：false，
href:'index.php'，
类型：“iframe”
});
});
});

这两个示例是来自同一页面还是不同页面？是的，在页面上的确切位置相同。如果我用第二个例子替换第一个例子，那么我会得到错误。第一个示例在没有单击的情况下运行良好，尽管非常奇怪。。。不知道为什么，但看看我的答案是否有效…未捕获类型错误：无法读取未定义的属性“fancybox”，因为某些原因fanxybox似乎对我的函数隐藏。。。这很奇怪。您的第一个示例使用document.ready块还是不使用document.ready块？如果我将第一个示例包装在document.ready中，它也会失败。如果我取出document.ready并只保留单击功能，则仍然会收到错误。Document.ready只是试图解决这个问题。您使用的是哪个版本的jquery？是的，这正是我正在做的，但是在一个类上，而不是在一个ID上，这不应该有什么区别。它应该可以工作，我的代码中肯定有冲突。我在走另一条路。谢谢你的帮助。