【问题标题】:Delay wordpress comment form post with jQuery to allow analytics to send tracking.使用 jQuery 延迟 wordpress 评论表单发布,以允许分析发送跟踪。
【发布时间】:2012-03-06 10:18:59
【问题描述】:

我正在尝试在我的 Wordpress cmets 表单上放置一个自定义事件,并希望在每次有人单击提交按钮时跟踪一个事件。我遇到的问题是表单提交并创建页面请求,而 Google 分析代码没有时间工作。

我需要延迟表单提交,以便有时间进行跟踪。我查找了类似的问题并尝试了各种解决方案,但似乎无法让它们发挥作用。任何帮助将不胜感激。

我的代码如下,我尝试延迟表单失败。

<form id="commentsForm" action="<?php echo get_option('siteurl'); ?>/wp-comments-      post.php" method="post" id="commentform">

<!-- Delay form submit to allow GA code to send -->
<script type="text/javascript">
$(document).ready(function(){
    $('#commentsForm').submit(function (e) {
    var form = this;
    e.preventDefault();
    setTimeout(function () {
        form.submit();
    }, 1000); // in milliseconds
});
}); 
</script>

<?php if ( is_user_logged_in() ) : ?>

<p>Logged in as <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><? php echo $user_identity; ?></a>. <a href="<?php echo wp_logout_url(get_permalink()); ?>"  title="Log out of this account">Log out &raquo;</a></p>

<?php else : ?>

<p class="textfield">
<input name="author" id="author" value="<?php echo esc_attr($comment_author); ?>"  size="22" tabindex="1" type="text" <?php if ($req) echo "aria-required='true'"; ?>>

<label for="author"><small>Name <?php if ($req) echo "(required)"; ?></small></label>   </p>

<p class="textfield"><input type="text" name="email" id="email" value="<?php echo esc_attr($comment_author_email); ?>" size="22" tabindex="2" <?php if ($req) echo "aria-required='true'"; ?>>
<label for="email"><small>Mail (will not be published) <?php if ($req) echo "(required)"; ?></small></label></p>

<p class="textfield"><input type="text" name="url" id="url" value="<?php echo esc_attr($comment_author_url); ?>" size="22" tabindex="3">
<label for="url"><small>Website</small></label></p>

<?php endif; ?>

<!--<p><small><strong>XHTML:</strong> You can use these tags: <code><?php echo allowed_tags(); ?></code></small></p>-->

<p class="text-area"><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>

//Submit button
<p><input class="submitButton" onClick="_gaq.push(['_trackEvent','Comment','Submit', URL]);" name="submit" type="submit" id="submit" tabindex="5" value="" />


<?php comment_id_fields(); ?>
</p>
<?php do_action('comment_form', $post->ID); ?>

</form>

我认为它可能不起作用,因为表单是 PHP 表单,但我不确定让它工作的最佳方法。

感谢您的任何帮助或想法。

【问题讨论】:

  • 你的例子对我有用。究竟什么不适合你?
  • 好吧,我可以让表单提交,但不触发 GA 代码(因为它加载 wp-cmets-post.php 太快),或者我可以让代码提交GA 事件,但不提交表单。在上面的示例中,表单提交,但不幸的是,一旦单击提交按钮,它就会提交,这意味着 GA 事件没有时间发送自定义事件。谢谢你帮我看看。

标签: php jquery html wordpress google-analytics


【解决方案1】:

您可能遇到提交onclick 触发和form.submit() 事件触发的顺序问题。您可以尝试将点击事件从您的提交按钮中拉出并将其放在您的提交功能中吗?

类似这样的:

$(document).ready(function(){
    $('#commentsForm').submit(function (e) {
    var form = this;
    e.preventDefault();
    _gaq.push(['_trackEvent','Comment','Submit', URL]);
    setTimeout(function () {
        form.submit();
    }, 1000); // in milliseconds
});
});

另外,也许我在您的示例中错过了它,但URL 是什么?

【讨论】:

  • 感谢您的回复。 URL 变量是使用 var URL= location.href 位于我的 Header 中的页面的 URL。可能应该包括那个。我尝试了您的方法,它允许发生自定义事件,但在控制台中我收到错误 Uncaught TypeError: Property 'submit' of object # is not a function。这会停止表单提交,不幸的是不再起作用。我将在今天晚些时候发布一个示例,我需要在外部镜像该站点。我很困惑为什么提交不会延迟。
  • 万岁!我使用您的解决方案和在另一个线程上找到的另一个解决方案的组合解决了它(我似乎无法链接到,将在解决方案中发布)。我使用您的代码并将提交按钮更改为 ,更改名称和 ID .感谢您的帮助!
  • 那么我的答案是否得到了检查?很高兴我能帮上忙
  • 是的,对不起。我忘记检查了。再次感谢你的帮助。 Stack Overflow 再次拯救了这一天!
猜你喜欢
  • 2011-10-15
  • 1970-01-01
  • 1970-01-01
  • 2016-06-17
  • 2011-05-17
  • 1970-01-01
  • 2011-07-11
  • 2012-06-20
  • 1970-01-01
相关资源
最近更新 更多