javascript - jQuery 合并数据属性

Question

当我单击按钮时，我试图连接两个数据属性，我想知道如何将它们合并为一个，而不是在第一个属性之前添加字符串，

HTML

<div id="parent">
    <button class="first" data-first='{"id":"1"}'>Test</button>
    <button class="second" data-second='{"action":"0"}'>Test</button>
</div>

当我单击带有 .first 的按钮时，我想将 data-first 与 data-second 合并

jQuery

$('.parent').on('click', '.first', function() { 

    var old = $('.second').attr('data-object');

    var add = $(this).attr('data-object');

    $('.second').attr('data-object', add+old);

});

但是这会返回

data-second="{"id":"1"}{"action":"0"}"

我正在寻找的是

data-second="{"action":"0","id":"1"}"

任何帮助将不胜感激。

Answer 1

$('.second').data('object', $.extend({}, add, old));

http://api.jquery.com/jQuery.extend/

有一个方便的方法可以处理 jquery 中的 data- 属性:http://api.jquery.com/data/

演示:http://jsfiddle.net/CqrwF/