Javascript 通过onclick按钮跟踪Google Analytics事件_Javascript_Google Analytics

Javascript 通过onclick按钮跟踪Google Analytics事件

javascript google-analytics

Javascript 通过onclick按钮跟踪Google Analytics事件,javascript,google-analytics,Javascript,Google Analytics,我想追踪有多少人在点击按钮，谷歌分析将收集会话。然而，我无法在谷歌分析事件中获得任何结果。我的代码如下： <script> function handleOutboundLinkClicks(event) { ga('send', 'event', { eventCategory: 'Outbound Link', eventAction: 'click', eventLabel: event.target.href, tra

我想追踪有多少人在点击按钮，谷歌分析将收集会话。然而，我无法在谷歌分析事件中获得任何结果。我的代码如下：

<script>
          function handleOutboundLinkClicks(event) {
  ga('send', 'event', {
    eventCategory: 'Outbound Link',
    eventAction: 'click',
    eventLabel: event.target.href,
    transport: 'beacon'
  });
}

      </script>

<input type="submit" id="submit" value="Validate and Submit" onclick=”_gaq.push([‘_trackEvent’, ‘form, ‘submit’, ’order sent’, 10]);”/>


函数handleOutboundLinkClicks（事件）{
ga（‘发送’、‘事件’{
eventCategory:“出站链接”，
eventAction:'单击'，
eventLabel:event.target.href，
交通：“灯塔”
});
}

//// 我的按钮的代码如下：

<script>
          function handleOutboundLinkClicks(event) {
  ga('send', 'event', {
    eventCategory: 'Outbound Link',
    eventAction: 'click',
    eventLabel: event.target.href,
    transport: 'beacon'
  });
}

      </script>

<input type="submit" id="submit" value="Validate and Submit" onclick=”_gaq.push([‘_trackEvent’, ‘form, ‘submit’, ’order sent’, 10]);”/>

然后，此页面的完整代码：

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Keepsake Florals</title>
    <!--link to external css file-->

<link rel="stylesheet" type="text/css" href="keepsakeflorals.css"/>
<link rel="stylesheet" type="text/css" href="ksform.css" />
<link rel="shortcut icon" href="favicon.ico" />
   <script src="scripts/jquery-1.11.3.min.js"></script>




      <script>

      function handleOutboundLinkClicks(event) {
  ga('send', 'event', {
    eventCategory: 'Outbound Link',
    eventAction: 'click',
    eventLabel: event.target.href,
    transport: 'beacon'
  });
}

      </script>



</head>
<body>

<div id="box">
<h1><a href="index.html" title="click here to return home"> KEEPSAKE FLORALS </a> </h1>
</div>

<div>
<nav id="mainnav"> 
<a href="index.html"> Home</a> |
<a href="aboutus.html"> About Us  </a> |
<a href="flowers.html"> Flowers </a> |
<a href="order.html"> Order </a> |
<a href="review.html"> Review </a> |
</nav>
</div>



<form action="thankyou.html" id="contact-form">

  <fieldset id="contactinfo">
  <legend> <span> Contact Information </span> </legend>
    <label> 
    Name
    <input type="text" name="name" id="nameinput" placeholder="First and last name"  />
    </label>
      <label>
      Email
      <input type="email" name="email" id="emailinput" placeholder="address@example.com" />
      </label>
      <label>
      Phone
      <input type="text" name="phone" id="phoneinput" placeholder="phone number" />
      </label>

     </fieldset>

        <fieldset id="orderflower">
          <legend> <span> Flowers to order </span> </legend> 
          <label for="mother" >
             <input type="radio" name="flower" id="mother" value="mother" checked="checked"  />
             Mother's day flower 
             </label>
                 <label for="father">
                         <input type="radio" name="flower" id="father" value="father" />
                        Fathers day flower
             </label>
                     <label for="otheroccasion">
                    <input type="radio" name="flower" id="occasion" value="occasion"  />
                    Other occasion flower
                            </label>

             <label for="valentinesday">
                 <input type="radio" name="flower" id="vday" value="vday" />
                  Valentine's Day
                  </label>

             <label for="others">
                <input type="radio" name="flower" id="others" value="others"  />
                  Others

                  <input type="text" name="other" id="otherinput">
                  </label>    
              </fieldset>
          <fieldset id="delivery">
          <legend> <span> How to contact you ? </span> </legend>
          <label for "question">
              <input type="radio" name="flower" id="phone"  />
                 Via my handphone number
                 </label>
                  <label for "question">
              <input type="radio" name="flower" id="email"  />
                 Via my email
                 </label>


          </fieldset>
          <fieldset id="helpneeded" >

          <legend> <span> Any help needed? </span> </legend> 
          <textarea id="helpneeded" name="helpneeded" rows="4" cols="20"> </textarea>
          </fieldset>    
           <input type="submit" id="submit" value="Validate and Submit" onclick=”ga('send', 'event', 'form', 'submit', 'order sent', 10);”/>
</form>
</body>
</html>


信物花
函数handleOutboundLinkClicks（事件）{
ga（‘发送’、‘事件’{
eventCategory:“出站链接”，
eventAction:'单击'，
eventLabel:event.target.href，
交通：“灯塔”
});
}
|
|
|
|
|
联系方式
名称
电子邮件
电话
订购鲜花
母亲节花
父亲节花
其他场合花
情人节
其他
如何联系你？
通过我的手机号码
通过我的电子邮件
需要帮忙吗？

有两件事不对：

您将不推荐的经典GA语法与新的Universal Analytics语法混合在一起。UA不再使用

\u gaq

对象。您的

onclick

代码应该是：

ga('send', 'event', 'form', 'submit', 'order sent', 10);

请注意，您还混合了智能引号和直接引号。你应该直接引用

您已经定义了一个函数

handleOutboundLinkClicks

，该函数似乎与按钮不相关，因此当您单击按钮时，将不会看到

出站链接

事件

但是出于所有目的，我发布的代码应该适用于您的按钮，如果这是您主要关心的问题。

有两件事是错误的：

您将不推荐的经典GA语法与新的Universal Analytics语法混合在一起。UA不再使用

\u gaq

对象。您的

onclick

代码应该是：

ga('send', 'event', 'form', 'submit', 'order sent', 10);

请注意，您还混合了智能引号和直接引号。你应该直接引用

您已经定义了一个函数

handleOutboundLinkClicks

，该函数似乎与按钮不相关，因此当您单击按钮时，将不会看到

出站链接

事件

但是出于所有目的，我发布的代码应该适用于您的按钮，如果这是您主要关心的问题。

这有点晚了，但我希望这将有助于解决这个问题的人

您的问题很可能是因为一旦表单提交并加载新页面（

thankyou.html

），Google Analytics Javascript代码就会停止执行。您有两个选择：

使用

传输

属性并将其值设置为

信标

：

对于不支持

信标

传输方法的浏览器，可以使用回调函数：

在HTML中，修改提交按钮（删除

onclick

属性）：

参考资料：