Question

<ul>
    <li class="foo" data-something="earth">one</li>
    <li class="foo" data-something="wind">two</li>
    <li class="foo" data-something="fire">three</li>
</ul>

要获取data-*属性的值，在jQuery中我会写：

$(document).on('click', '.foo', function(e){
   // get the attribute of the specific .foo that was clicked
   // clicking "two" assigns the value "wind" to bar
   var bar = $(this).data('something');
});

在Dojo，我试过：

on(query('.foo'), 'click', function(e){
   // get the attribute of the specific .foo that was clicked
   var bar = dojo.attr(this, 'data-something');
});

但我发现this背景是＆＃34;没有工作＆＃34;正如预期/想要的那样，我获得了n bar的{{1}}而不是1.我试过了：

query('.foo').forEach(function(e) {
    on(e, 'click', function(evt) {
        var bar = dojo.attr(this, 'data-something');
    });
});

但是我没有得到一致的结果....基本上我想从特定的data-*点击访问.foo属性，而不是全部，并且会感谢推进正确的方向。

Answer 1

我不确定你做错了什么，因为你的第一次尝试对我有用，也许在你不会分享的一段代码中有一些错误？这是一个有效的例子：

＆＃13;

require([
    'dojo/on',
    'dojo/query',
    'dojo/domReady!'
], function(
    on,
    query
) {

    on(query('.foo'), 'click', function (e) {
       var bar = dojo.attr(this, 'data-something');
       alert(bar);
    });
    
});

＆＃13;

<!DOCTYPE html>
<html>
    <head>
        <script type="application/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
    </head>
    <body>
        <ul>
            <li class="foo" data-something="earth">one</li>
            <li class="foo" data-something="wind">two</li>
            <li class="foo" data-something="fire">three</li>
        </ul>
    </body>
</html>

＆＃13;

Dojo版本的jQuery＆＃34; on＆＃34;点击

1 个答案: