Question

我有以下一段代码，点击一个类undo的按钮即可触发。此处变量cls按预期提供输出a3，a2等，但是当我在

中使用cls时

var some = $("path#path"+cls_id).data("id").cls ;，

我收到undefined的提醒结果。但是，当我手动将cls替换为a3或a2时，得到了结果。完整代码：

$('body').on('click','.undo',function () { 
    var cls_id = $(this).parent().attr('class');
    var cls = $(this).attr('data-undo');
    var some = $("path#path"+cls_id).data("id").cls;
    alert(some);
});

HTML

<path id="path1" stroke="rgb(178, 34, 34)" stroke-width="2" fill="none" d="M683 137 L742 217 L535 301 L513 220" data-id="{ "a1":"L33 24", "a2":"L442 89" }"></path>

有人请建议一种解决问题的方法。

Answer 1

如果您已将元素定义为以下

<div class="test" data-id-cls="me"></div>

然后你应该按如下方式访问它

var some = $(".test").data("idCls");

注意cls中的“C”在大写

Answer 2

我猜问题是选择器path，因为HTML中没有定义元素path。由于您已经使用了id选择器#path...，因此也无需进一步限制选择器。

只需使用id选择器就足够了，例如

var some = $("#path"+cls_id).data("id").cls;

当您查看data-id属性时，您会看到引号出现问题。

data-id="{ "a1":"L33 24", "a2":"L442 89" }"

当您将封闭的双引号更改为单引号时，您距离解决方案更近一步，例如

data-id='{ "a1":"L33 24", "a2":"L442 89" }'

这将为您提供您正在寻找的对象。第二部分当然是添加cls属性。缺少的属性是a1或a2工作的原因，但cls不是

data-id='{ "a1":"L33 24", "a2":"L442 89", "cls": "some value" }'

如果cls不是名称本身，但包含属性的名称，即a1或a2，则必须使用bracket notation

var some = $("#path"+cls_id).data("id")[cls];

或

var obj = $("#path"+cls_id).data("id");
var some = obj[cls];

另见MDN - Working with objects

获得结果：＆＃34; undefined＆＃34;

2 个答案: