Question

拥有动态的html div

<a data-id="17" onclick="getcustomer();">
    <div class="note note-success">
        <h4 class="block">A</h4>
        <p>Email : a@gmail.com</p>
        <p>Mobile : 8</p>
        <p>DOB : 0000-00-00</p>
    </div>
</a>

在click.it上的上述锚点中调用此函数

function getcustomer(){
    var id = $(this).data('id');
    alert (id);      
    $.post(base_url+'who/customer', {
        customer_id: id
    }, function(data, status){
        console.log(data);
    });
}

但警报接收未定义。

我如何获取data-id值？

这是动态字段。这是在dom加载后添加的。

Answer 1

this并未引用该元素，而是引用window

将this作为getcustomer函数

的参数传递

function getcustomer(elem) {
  var id = $(elem).data('id');
  alert(id);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a data-id="17" onclick="getcustomer(this);">
  <div class="note note-success">
    <h4 class="block">A</h4>
    <p>Email : a@gmail.com</p>
    <p>Mobile : 8</p>
    <p>DOB : 0000-00-00</p>
  </div>
</a>

或使用.on方法更好地使用jQuery事件绑定

$('.eventBinding').on('click', function() {
  var id = $(this).data('id');
  alert(id);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a data-id="17" class='eventBinding'>
  <div class="note note-success">
    <h4 class="block">A</h4>
    <p>Email : a@gmail.com</p>
    <p>Mobile : 8</p>
    <p>DOB : 0000-00-00</p>
  </div>
</a>

Answer 2

将对象传递给方法

<a data-id="17" onclick="getcustomer(this);">

然后代码将是，

function getcustomer(obj) {
  var id = $(obj).data('id');
  alert(id);
  $.post(base_url + 'who/customer', {
      customer_id: id
    },
    function(data, status) {
      console.log(data);
    });
}

Answer 3

试试这个：

<a data-id="17" onclick="getcustomer(this);">

function getcustomer(curr_obj){
    var id = $(curr_obj).data('id');
    alert (id);

   $.post(base_url+'who/customer',
   {
       customer_id: id
   },
   function(data, status){
       console.log(data);
   });
}

Answer 4

如果您使用$（this）.attr（'data-id'）;

，该怎么办？

Answer 5

尝试这个，如果它有效。它只是简单的一行代码。

$('a').on('click', function(){
    var id = $(this).attr("data-id");

    alert(id);
});

或者你可以根据你的代码尝试这个，

function getcustomer(){

var id = $(this).attr('data-id');
alert (id);

$.post(base_url+'who/customer',
{
    customer_id: id
},
  function(data, status){
      console.log(data);
  });
}

Answer 6

使用此脚本

function getcustomer(){

    var id = $(this).attr('data-id');
    alert (id);

    $.post(base_url+'who/customer',
    {
        customer_id: id
    },
    function(data, status){
        console.log(data);
    });
}

动态内容数据ID在jquery中不起作用

6 个答案: