JavaScript自定义跟踪器

Question

我想为CakePHP 2.x中构建的基于Web的应用程序构建跟踪系统.我们的想法是将所有跟踪链接写成如下:

<a 
  href="#" 
  class="track-click" 
  data-tracking='{ 
    "trackers": [
      {
        "tracker": "----", 
        "eventId": "---",
        "tracking_options": { 
          "eventTargetUrl": "---", 
          "props": [{ 
            "key": "----", 
            "value": "---"  
          }]
        } 
      } 
    ]
  }'
/>

处理跟踪请求的javascript应该能够收集驻留在数据跟踪属性中的信息.这可以通过在"跟踪点击"类onClick事件上附加点击事件来完成.

以下是我如何使用上面的链接:

$('.track-click').click(function(e){
  //Lets grab the data thats within the data-tracking attribute and do something with it
  var data = $(this).attr('data-tracking');
  alert(data.trackers);
  e.preventDefault();
});

在目前这个时刻,如果我提醒上面我得到了不确定.如果我在我的代码上放置$(this).attr('data-tracking').val(),我会得到以下错误:

TypeError: $(...).attr(...).val is not a function

如上所示,操作具有json数据的链接的最佳方法是什么？

Answer 1

你需要使用

var data = JSON.parse($(this).attr('data-tracking'));

这将返回您的对象.

否则你必须使用

  var data = $(this).data('tracking');

.data()会返回对象.而.attr()将字符串化并返回该对象.

DEMO