如何获得跨度

Question

的属性值上点击按钮要从跨度

<td style="border-style:None;"> 
    <span data-needed="4080"> 
    <input id="MainContent_grdr1_chkCheck_0" type="checkbox" name="ctl00$MainContent$grd2$ctl02$chkCheck"></span> 
    <a id="MainContent_grdr1_lnkViewLog_0" class="btn btn-primary btn-xs btn-graph" href="javascript:__doPostBack('ctl00$MainContent$grdRatesAcknowledge$ctl02$lnkViewLog','')"><i class="fa fa-line-chart" aria-hidden="true"></i></a> 
</td> 

与此代码获取[对象]作为警报试过值。

<script> 
    $('.btn-graph').on('click', function() { 
    var proid = $(this).closest('span').find('data-needed'); 
    alert(proid); 
    }); 
</script> 

Answer 1

使用attr()

$('.btn-graph').on('click', function (e) { 
    e.preventDefult(); 
    var proid = $(this).prev('span').attr('data-needed'); 
    alert(proid); 
    __doPostBack('ctl00$MainContent$grdRatesAcknowledge$ctl02$lnkViewLog','') 
} 

Answer 2

尝试改变这样的：

$('.btn-graph').on('click', function() { 
    var proid = $(this).parent().find('span').attr('data-needed'); 
    alert(proid); 
}); 

你也有<a>点击功能，它不会出现在HTML，因为你没有里面的东西<a>

https://jsfiddle.net/zs67d8an/1/

Answer 3

$('.btn-graph').on('click', function() { 
     var proid = $(this).closest('td').find('span').attr("data-needed");   
     alert(proid); 
}); 

Answer 4

可以达到最接近<td>，然后抢相关<span>象下面这样：

$(document).ready(function() { 
 
    $('.btn-graph').on('click', function() { 
 
    var proid = $(this).closest('td').find("span").data("needed"); 
 
    alert(proid); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td style="border-style:None;"> 
 
     <span data-needed="4080"> 
 
    <input id="MainContent_grdr1_chkCheck_0" type="checkbox" name="ctl00$MainContent$grd2$ctl02$chkCheck"></span> 
 
     <a id="MainContent_grdr1_lnkViewLog_0" class="btn btn-primary btn-xs btn-graph" href="javascript:__doPostBack('ctl00$MainContent$grdRatesAcknowledge$ctl02$lnkViewLog','')"><i class="fa fa-line-chart" aria-hidden="true"></i>Click</a> 
 
    </td> 
 
    </tr> 
 
</table>