越來越空的警報文本上點擊確認按鈕

Question

這裏是腳本 -

function gettext() {  
    var $row = $(this).closest("tr"); 
    var $text = $row.find(".id").text(); 
    alert($text); 
} 

這裏是HTML代碼 -

<tr> 
    <td>1</td> 
    <td class="id"> 
     <%=u.getMid()%> 
    </td> 
    <td> 
     <%=u.getName()%> 
    </td> 
    <td> 
     <%=u.getEmailId()%> 
    </td> 
    <td> 
     <%=u.getStatus()%> 
    </td> 
    <td> 
     <button type="submit" class="btn btn-success bnt-sm" onclick="gettext()">Approve</button> 
     <button type="submit" class="btn btn-danger bnt-sm">Reject</button> 
    </td> 
</tr> 

讓我知道爲什麼它不工作

Answer 1

問題是因爲您正在使用on*事件屬性來調用該函數。這意味着this將引用window，而不是單擊元素。

要解決此問題，您可以通過刪除on*屬性並使用不顯眼的JS代碼綁定事件處理程序來改善您的代碼。試試這個：

$('.btn-success').click(function() { 
 
    var $row = $(this).closest("tr"); 
 
    var $text = $row.find(".id").text(); 
 
    alert($text); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td >1</td> 
 
    <td class="id">Mid</td> 
 
    <td>Name</td> 
 
    <td>EmailId</td> 
 
    <td>Status</td> 
 
    <td> 
 
     <button type="submit" class="btn btn-success bnt-sm">Approve</button> 
 
     <button type="submit" class="btn btn-danger bnt-sm">Reject</button> 
 
    </td> 
 
    </tr> 
 
</table>

需要注意的是，如果你有一個父form元素，那麼你可能需要停止表單提交，這取決於你的意圖，點擊提交按鈕時。我還建議給他們每個人一個name屬性，以便您可以識別發送請求時點擊了哪個。