Google 跟踪代码管理器 - 捕获 Select 值

Question

我正在尝试捕获 <select> 值，将它们推送到数据层并使用 Google 跟踪代码管理器将它们推送到 Analytics 帐户。这是我试图从 中抓取值的代码，其中包含一个动态选择的属性 ：

<select class="dropdown__select" size="1" id="dyeMethod" name="dyeMethod" onchange="javascript:UpdateSearchResults('FilterSearchForm')">
                                        <option value="ALL">ALL</option>

        <option value="395" >
         Piece Dyed</option>            

        <option value="402"  selected="selected">
         Solution Dyed</option>            

        <option value="406" >
         Solution Dyed /  Yarn Dyed</option>            

                            </select>
                </div>
            </div>

首先，我创建了一个自定义 HTML 标签来获取被禁止的值并将它们推送到数据层（下面的标签代码）：

    document.addEventListener('change', function(e) {
      if (e.target.className === 'dropdown__select') {
        var selected = e.target.options ? e.target.options[e.target.value] : undefined;

        window.dataLayer.push({
          'event' : 'valueSelected',
          'selectedValue' : selected ? (selected.value) : ''
        });
      }
    };

此标记在 DOM 就绪时触发，并且在 'valueSelected' 被推送到数据层时触发。然后我创建了一个数据层变量 ('selectedValue') 并将其指定为 GA 标签上的事件标签，该标签仅在选择 'dropdown__select' class 时触发。

标签传递类别和操作，但标签显示为“（未设置）”。必须有一种更有效的方法来捕获这些值并传递它们！！

Answer 1

DOM Ready 和 valueSelected 都是事件键的值，因此无法在一个触发器中同时使用这两个规则来触发自定义 HTML 标记。

尝试在 DOM Ready 和 Google Analytics 标签等于 valueSelected 时触发自定义 HTML 标签。

Google 跟踪代码管理器 - 捕获 Select 值

Google Tag Manager - Capture Select Values

html

javascript

google-analytics

google-tag-manager