magnific-popup传递一个变量

Question

我正在尝试制作 包含某些形式的大胆弹出窗口.我想通过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>

我需要这个,因为我将生成服务器端(w.PHP)启动器,以便每个链接将生成不同的表单数据.

编辑:我想到的一种方法是在启动器中使用自定义属性,例如:

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

但我无法真正获得正确的jQuery语法来嵌套属性处理INSIDE the magnific-popup inizialization.我的js/jquery知识非常基础,所以谢谢你的提示.

Answer 1

如何在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
});