5

壮大なポップアップにいくつかのフォームを含めようとして います。htmlアンカーを介して変数を最終的なポップアップに渡したいと思います。この疑似コードのVar1として:

<!-- HTML launcher element -->
<a href="#test-popup?Var1=X" class="open-popup-link">Show inline popup</a>

<!-- Popup itself -->
<div id="test-popup">
    <form method="post" action="">
        <input type="hidden" id="myVar" name="Var1" value="[placeholder]" />
        <input type="submit" />
    </form>
</div>

<!-- Inizialization -->
<script type="text/javascript">
    $(document).ready(function() {
        $('.open_popup_link').magnificPopup({
        type:'inline',
        midClick: true,

            function() {
                **Here some magic code that sets Var1 = X **
                $('#myVar').attr('value', function(i, attr){
                return attr.replace('[placeholder]', Var1);
                });}
        });
    });
</script>

各リンクが異なるフォーム データを生成するように、サーバー側 (PHP を使用) でランチャーを生成するため、これが必要です。

編集:私が考えた1つのアプローチは、ランチャーでカスタム属性を使用することでした。

<a href="#test-popup" data-var1="X" class="open-popup-link">Show inline popup</a>

しかし、magnific-popup の初期化の内側で処理する属性をネストするための適切な jQuery 構文を実際に取得できませんでした。私の js/jquery の知識は非常に基本的なものなので、何かヒントがあればよろしくお願いします。

4

2 に答える 2

8

リンクがクリックされるたびに入力の値を変更するmagnificPopup設定の外で別のクリックハンドラーを使用するのはどうですか。プラグインを初期化する前に必ずバインドしてください

HTML

正しく提案されたデータ属性の使用

<a href="#test-popup" data-var1="X" class="open-popup-link">Show inline popup</a>

Javascript

$('.open-popup-link').click(function(){
    $('#myVar').val($(this).data('var1'));
});

$('.open_popup_link').magnificPopup({
   type:'inline',
   midClick: true
});
于 2013-07-28T06:29:23.177 に答える
0

試す：

JavaScript/jQuery

<script type="text/javascript">
$(document).ready(function() {

    $('.open_popup_link').magnificPopup({
    type:'inline',
    midClick: true,

        function() {
            **Here some magic code that sets Var1 = X **
             Var1 = $('#myVar').val(); 
            });}
    });
});

何に使用Var1しているのかよくわかりませんが、それが入力からグローバルVar1変数への値を取得する方法です。

あなたが正しくやろうとしていることを理解できなかった場合はお知らせください。

于 2013-07-28T05:52:58.820 に答える