0

この単純なコードが実行されない理由がわかりません。

私は何かが恋しいですが、何がわかりません:

HTML :

<span class="test" url="mapage.php">It's a test</span>

Javascript :

 jQuery(function () {
    $(document).ready(function () {

        $('.test').on('click', function () {
            //alert($(this).attr('url'));
            $.fancybox({ 'href': $(this).attr('url') });
        });
    });

});

firebugにエラーはありません。

フィドル: http://jsfiddle.net/6ZZJH/4/

4

3 に答える 3

2

最初に、ドキュメント対応関数をネストしました...

試す

$(document).ready(function () {

    $('.test').on('click', function () {
        //alert($(this).attr('url'));
        $.fancybox({ 'href': $(this).attr('url') });
    });
});

または上記の省略形です。

 $(function () {

        $('.test').on('click', function () {
            //alert($(this).attr('url'));
            $.fancybox({ 'href': $(this).attr('url') });
        });
});

UPDATE ワーキングjsfiddle：http ://jsfiddle.net/kasperfish/6ZZJH/9/ URLを開く場合は、fancyboxタイプをiframeに指定する必要があります...

            $(document).ready(function () {

            $('.test').click(function () {

                btn=$(this);

                btn.fancybox({
                    "type": 'iframe',
                    "href": btn.attr('url')
                });


            });
        });
于 2013-09-27T09:47:24.387 に答える
0 
  jQuery(function () {
 $(document).ready(function () {

    $('.test').on('click', function () {
        //alert($(this).attr('url'));
        $.fancybox({ 'href': $(this).attr('url') });
    });
 });

});

する必要があります

$(document).ready(function () {
    $('.test').on('click', function () {
        //alert($(this).attr('url'));
        $.fancybox({ 'href': $(this).attr('url') });
    });
 });

また、html 内にjquery.fancybox.version.jsとjquery.fancybox.version.cssが含まれていることを確認してください。

于 2013-09-27T09:48:11.353 に答える
0

いくつかの問題があります: 最初: 次のようにコードを書く必要があります:

$(function () {
 //your code here
});

jQuery の準備ができた場合にのみ、コードが実行されます。

次に、jsfiddle 内のケースでは、fancybox lib がロードされていません。

それを追加する必要があります：

<link type="text/css" rel="stylesheet" href="//cdn.jsdelivr.net/fancybox/2.1.5/helpers/jquery.fancybox-buttons.css" />
<script type="text/javascript" src="//cdn.jsdelivr.net/fancybox/2.1.5/helpers/jquery.fancybox-buttons.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/fancybox/2.1.5/helpers/jquery.fancybox-media.js"></script>
<link type="text/css" rel="stylesheet" href="//cdn.jsdelivr.net/fancybox/2.1.5/helpers/jquery.fancybox-thumbs.css" />
<script type="text/javascript" src="//cdn.jsdelivr.net/fancybox/2.1.5/helpers/jquery.fancybox-thumbs.js"></script>
<link type="text/css" rel="stylesheet" href="//cdn.jsdelivr.net/fancybox/2.1.5/jquery.fancybox.css" />
<script type="text/javascript" src="//cdn.jsdelivr.net/fancybox/2.1.5/jquery.fancybox.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/fancybox/2.1.5/jquery.fancybox.pack.js"></script>

最後に、URL は画像でなければなりません:

そのように：

<span class="test" url="http://farm3.static.flickr.com/2647/3867677191_04d8d52b1a.jpg">It's a test</span>

ここで jsfiddle : http://jsfiddle.net/5QYGe/1/

于 2013-09-27T09:59:57.993 に答える