0

ライトボックスを使用してフォームを開こうとしていますが、フォーム自体は別のページで使用されている html です。

問題は、ShadowBoxを試して iframe を開くことです。変数のほとんどはその過程で失われます。試しLightbox5てみましたが、html に渡すコードが見つからないようです。

助言がありますか?

私はShadowBoxでこのようなことをしました

<a rel="shadowbox[MyStuff]" href="survey.html">survey</a>

渡された要素がhtmlであることを解析しますが、iframeで開くため、このページにある変数が失われます

サンプルコード全体を追加

<html>

<head>
    <!-- the shadowbox stylesheet and js -->
    <link rel="stylesheet" type="text/css" href="jquery.lightbox-0.5.css"
    media="screen" />
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="jquery.lightbox-0.5.js"></script>
    <script type="text/javascript">
        $(document)
            .ready(function ()
        {
            // Use this example, or...
            $('a[@rel*=lightbox]')
                .lightBox(); // Select all links that contains lightbox in the attribute rel
            // This, or...
            $('#gallery a')
                .lightBox(); // Select all links in object with gallery ID
            $('#somehiddendiv div')
                .lightBox(); // Select all links in object with gallery ID
            // This, or...
            $('a.lightbox')
                .lightBox(); // Select all links with lightbox class
            // This, or...
            $('a')
                .lightBox(); // Select all links in the page
            // ... The possibility are many. Use your creative or choose one in the examples above
        });
        $(function ()
        {
            $.ajax(
            {
                url: 'survey.html',
                dataType: 'html',
                success: function (data)
                {
                    $('#somehiddendiv')
                        .html(data);
                }
            });
        });
    </script>
</head>

<body>
    <!-- <a href="egypt.jpg"><img src="download.jpg" width="72" height="72" alt="" /></a>
-->
    <div id="somehiddendiv"></div>

</body>

4

2 に答える 2

1
$(function(){

    $.ajax({
        url: 'yourotherhtmlpage.html',
        dataType: 'html',
        success: function(data){
            $('#somehiddendiv').html(data);
        }
    });
});

次に、ライトボックス ウィンドウで div を開くリンクなどを追加します。または、コードで開きます。

于 2012-10-04T09:21:58.783 に答える
0

同じ目的でfancyboxプラグインを使用することもできます

$(document).ready(function() {

    /* This is basic - uses default settings */

    $("a#single_image").fancybox();

    /* Using custom settings */

    $("a#inline").fancybox({
        'hideOnContentClick': true
    });

    /* Apply fancybox to multiple items */

    $("a.group").fancybox({
        'transitionIn'  :   'elastic',
        'transitionOut' :   'elastic',
        'speedIn'       :   600, 
        'speedOut'      :   200, 
        'overlayShow'   :   false
    });

});
于 2012-10-04T09:20:46.657 に答える