通过GTM自定义JavaScript变量获取元素文本 [英] Get element text through GTM Custom JavaScript Variable

问题描述

我有两组具有相同类名的链接，唯一的区别是中的文本. 我需要获取点击链接的文字，然后通过GTM将其传递给GA.

I have two groups of links all with the same class names, the only difference is the text in the . I need to get the text for the clicked link and pass it to GA through GTM.

<div class="item-set">
  <header>Section Title One</header>
  <section class="products">
    <div class="list">
      <a href="/Product/60216935"><img src="/ProductImages1.jpg"></a>
    </div>
    <div class="list">
      <a href="/Product/6021693x"><img src="/ProductImages2.jpg"></a>
    </div>
    <div class="list">
      <a href="/Product/6021693y"><img src="/ProductImages3.jpg"></a>
    </div>
  </section>
</div>
<div class="item-set">
  <header>Section Title Two</header>
  <section class="products">
    <div class="list">
      <a href="/Product/60216935"><img src="/ProductImages1.jpg"></a>
    </div>
    <div class="list">
      <a href="/Product/6021693x"><img src="/ProductImages2.jpg"></a>
    </div>
    <div class="list">
      <a href="/Product/6021693y"><img src="/ProductImages3.jpg"></a>
    </div>
  </section>
</div>

我创建了一个自定义javascript变量

I have created a custom javascript variable

function() {
  $('section.products div.list').click(function() {
    return $(this).closest('.item-set').find('header').text();
  });
}

但是 bleep 并没有按照我的预期(或根本没有)工作.它返回未定义".

But the bleep thing isn't working as I expect (or at all). It returns "undefined".

我们非常感谢您的协助.

Any assistance is greatly appreciated.

推荐答案

您不应在JS变量中绑定到click事件.您应该在GTM中使用JS变量仅用于接收值

You shouldn't bind to click event in JS variable. You should use JS variables in GTM only for receiving values

实现目标的正确方法是:

The correct way to achieve your goal is:

1)启用内置变量Click Element(如果已有的话，可以跳过此步骤)

1) Enable built-in variable Click Element (if you already have it, you can skip this step)

2)创建触发器，当您单击链接时将触发 屏幕截图上的CSS选择器是.item-set .list a

2) Create trigger, which will fire when you clicking on your links CSS selector on the screenshot is .item-set .list a

3)创建JS变量 代码是:function() { return $({{Click Element}}.closest('.item-set')).find('header').text(); } 3)创建一个代码，该代码会将数据发送到GA 在这里，您可以使用步骤3 {{Click List Header}}

3) Create JS variable Code is: function() { return $({{Click Element}}.closest('.item-set')).find('header').text(); } 3) Create a tag, which will send data to GA Here you can use your variable form step 3 {{Click List Header}}

这篇关于通过GTM自定义JavaScript变量获取元素文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！