.attr（）函数不起作用

Question

I know that this question has been asked and answered multiple times but the solutions i found isn't working for me.

this is the html element generated by php code :

<?php 

//here $index is a php variable and countIndex is my custom attribute

echo '<span class="glyphicon glyphicon-trash btnAction btnRemove tooltips" title="Remove" style="float:right" onclick="deleteData()" data-countIndex="'.$count.'"></span>';

?>

now when i click the span tag i want to alert it's custom attribute. And this is the code i used:

 function deleteData()
{
  alert( $( this ).data('countIndex') );

     // also tried these but didn't work
    // alert( jQuery( this ).attr( 'countIndex' ) );
   // alert( $( this ).attr( "class" ) );
}

I have verified it many times but i am not able to trace out the bug . Please find out the problem with my code.

Answer 1

I have added hard coded the value "11" for data-countIndex to show a demo

function deleteData(elem){
  console.log($(elem).attr("data-countIndex"))
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span onclick="deleteData(this)" data-countIndex="11">  
  test
</span>

Please try this

add "this"

onclick="deleteData(this)"

<span class="glyphicon glyphicon-trash btnAction btnRemove tooltips" title="Remove" style="float:right" onclick="deleteData(this)" data-countIndex="'.$count.'"></span>

function deleteData(elem){
    alert($(elem).attr("data-countIndex"))
}

</div>