Question

我使用magnify-popup来显示表单。我想将一些值传递给此表单。我怎么能这样做。我在文档中找不到这个。

$('#rangeBtn').magnificPopup({
    items: {
        src: '#rangeFormDiv',
        type: 'inline'
    }

});

由于

Answer 1

您可以在回调中抓取表单，然后在表单中插入值。

所以它可能看起来像是：

$('#rangeBtn').magnificPopup({
    items: {
        src: '#rangeFormDiv',
        type: 'inline'
    },
    callbacks: {
         beforeOpen: function() {
             // Your logic here
         }
    }
 });

有关详细信息，请查看API page。

Answer 2

示例rangeFormDiv：

<div id="rangeFormDiv">
  <form>
    <input type="text name="var1" value="">
    <input type="text name="var2" value="">
    <input type="text name="var3" value="">
    <input type="submit" value="save">
  </form>
</div>

<强>锚

<a href="#rangeFormDiv" data-variable="some content" class="magnificPopup">Open</a>

magnificPopup初始化：

$('.magnificPopup').magnificPopup({
    type: 'inline',

    fixedContentPos: false,
    fixedBgPos: true,

    overflowY: 'auto',

    closeBtnInside: true,
    preloader: false,

    midClick: true,
    removalDelay: 300,
    mainClass: 'my-mfp-zoom-in',
    modal: true,
    //define variable before open
    //target element: $($(this.items).attr('href'))
    //anchor: $(this.items)
    callbacks: {
        beforeOpen: function(){
            $($(this.items).attr('href')).find('input[name="var1"]').val($(this.items).data("variable"));
        }
    }
});

如何将值传递给表单

2 个答案: