自动填充联系人7表单,链接到同一页面上的锚点

时间:2015-11-18 21:15:08

标签: javascript php jquery wordpress contact-form-7

我按照this教程动态自动填充使用联系表单7创建的表单。 要自动填写表单,我正在使用插件Contact Form 7 Dynamic Text Extension

首先,我将以下函数附加到function.php

\\(

联系人7表单包含主题的动态字段:

// chalet name for enquiry form
function parameter_queryvars( $qvars ) {
    $qvars[] = 'chalet';
    return $qvars;
}
add_filter('query_vars', 'parameter_queryvars' );

function echo_chalet() {
    global $wp_query;
        if (isset($wp_query->query_vars['chalet']))
        {
            print $wp_query->query_vars['chalet'];
        }
}

有了这个,我可以使用不同主题的相同表格,根据点击的链接自动填写。 该链接只需包含chalet的查询。

[dynamictext enquiry-chalet "CF7_GET key='chalet'"]

www.mysitexyz.com/link/to/page/with/form.php?chalet=request

表格主题填写“请求”或“取消”。 这很好用。

现在我想在与链接相同的页面上自动填充表单。

该链接现在包含一个锚点: www.mysitexyz.com/link/to/page/with/form.php?chalet=cancellation

单击该链接,页面将向下滚动到锚点。我的wordpress主题顺利向下滚动。但该字段不是自动填充的。单击带有浏览器功能的页面可在新选项卡中打开。然后页面向下滚动到锚点并正确填写表单字段。但这不是人们通常所做的。

如何通过正常点击链接获得相同的结果?

1 个答案:

答案 0 :(得分:1)

使用jQuery,你可以这样做:

<a href="#" data-chalet="YOUR-VALUE" class="chalet-choser">Click here</a>

然后

$('.chalet-choser').on('click', function(e) {
  e.preventDefault();

  $('input[name="enquiry-chalet"]').val( $(this).data('chalet') );

  return false;
})