Question

我有这个包含数据属性的列表

<li id="1"><a href="#" class="me"  data-lrnumero="1">Hello</a></li>
<li id="2"><a href="#" class="me"  data-lrnumero="2">Hello</a></li>
<li id="3"><a href="#" class="me"  data-lrnumero="3">Hello</a></li>
<li id="4"><a href="#" class="me"  data-lrnumero="4">Hello</a></li>
<li id="5"><a href="#" class="me"  data-lrnumero="5">Hello</a></li>

我希望根据data-lrnumero设置内容。例如，当我点击<a>时，获取data-lrnumero值，然后仅在hello (value of data attribute)

上将内容设置为<a>

修改

我在<li>上设置了变量ID，例如<li id="1">，然后我创建了一个函数

$('.me').click(function (e) {
        e.preventDefault();
        $.ajax({
            url: "someurl",
            type: 'get',
            dataType: 'html'
        }).done(function (data) {
            if (data == 'true') {
              var iddata= $(this).data('lrnumero');
              $('#' + iddata).empty();                   
              $('#' + iddata).html('<a href="#" class="me"  data-lrnumero='+iddata+'>Hello '+iddata+'</a>');
            }
        });
    });

但有点复杂。我想设置只获取<a>的数据属性，然后设置新内容

Answer 1

JSFiddle：http://jsfiddle.net/TrueBlueAussie/oecgvtto/1/

$('li a').click(function(e){
    // Stop page jumping to top - as it is a bookmark link
    e.preventDefault();
    $(this).text("Hello " + $(this).data('lrnumero'));
});

对于新的示例代码，您需要在本地var（例如下面的$this）中保留单击的元素，而不是用ID替换整个LI！：

$('.me').click(function (e) {
    e.preventDefault();
    var $this = $(this);
    $.ajax({
        url: "someurl",
        type: 'get',
        dataType: 'html'
    }).done(function (data) {
        if (data == 'true') {
            var iddata = $this.data('lrnumero');
            $this.text("Hello " + iddata);
        }
    });
});

Answer 2

请检查以下内容：

var data = [];
$('li a').each(function(){
    data.push($(this).html());  
})

console.log(data);
$('li').click(function(){
    element = $(this).find('a');
    element.html(data[$('li').index(this)]+element.data('lrnumero'));
});

如果您需要更多详细信息，请与我们联系。

根据某个数据属性设置html内容

2 个答案: