獲取打開jQuery對話框的按鈕的ID

Question

我有多重按鈕。單擊按鈕時，jquery對話框即將到來。我想知道打開對話框的按鈕的ID。這裏是我的JSP代碼

<tbody> 
<c:forEach var="history" items="${history}" varStatus="loopCounter"> 
<c:forEach var="child" items="${history.child}" varStatus="loopCounter2"> 
<tr> 
     <td align="left"> 
      <span class = "item"> 
       <img src="img/vendor_logos/<c:out value="${child.courierProduct.logoName}" />"/> 
      </span> 
     </td> 
     <td align="left"> 
      <span> 
       <c:out value="${child.routeDetails.sourceName}" /> 
      </span> 
     </td> 
     <td align="left"> 
      <span> 
       <c:out value="${child.routeDetails.destinationName}" /> 
      </span> 
     </td> 
     <td align="left"> 
      <span class="cost" style="font-size: 23px;"><img src="img/rs.png" /> 
       <c:out value="${history.cost}" />/- 
      </span> 
     </td> 
     <td align="left"> 
      <span> 
       <c:out value="${child.orderTime}" /> 
      </span> 
     </td> 
     <td align="left"> 
     <span> 
     /* this div id i want to get in the jquery function */ 
     /* it is inside for so there can be multiple div which can trigger dialog box */ 
     <div id="${loopCounter.index}" name = "rate" class="rate" style="" title="Rate">Submit Review</div> 
     </span> 
     </td> 

</tr> 
</c:forEach> 
</c:forEach> 
</tbody> 

下面是該對話框的div

<div id="rateDialog" class="rateDialog" style="display:none;height:250px;width:500px;" title="Rating"> 
     <div id="showDialogMessage"></div> 
     <label>Rate your overall satisfaction:</label> 
     <div> 
     <input type="radio" name="rating" value="1" class="star"/> 
     <input type="radio" name="rating" value="2" class="star"/> 
     <input type="radio" name="rating" value="3" class="star"/> 
     <input type="radio" name="rating" value="4" class="star"/> 
     <input type="radio" name="rating" value="5" class="star"/> 
     </div> 
     <br/> 
     <label>Please provide your review: </label> 
     <textarea name="reviewArea" rows="5"></textarea> 
     <input id="submit" type="submit" value="Submit" style="margin : 18px 0px 0px 93px;"/> 
     </div> 

這裏是jQuery函數

<script> 
$(document).ready(function() { 
$(function() { 
    var rateDialog = $("#rateDialog").dialog({ 
     autoOpen: false, 
     minHeight:250, 
      width: 400, 
      height: 265, 
     open: function(event, ui) { 
      $("#showDialogMessage").hide(); 
      $('#reviewArea').val(''); 
      } 
     }); 

     $(".rate").on("click", function() { 
      // Display the dialog 
      rateDialog.dialog("open"); 
      alert($('div[name=rate]').attr('id')); 
     }); 
}); 
$("#submit").click(function(e) { 
$("#showDialogMessage").hide(); 
    var xmlhttp; 
    $("#submit").prop('disabled',true); 
    alert("called"); 
     var url=""; 
     if (window.XMLHttpRequest) 
     { 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     { 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 

      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       $("#submit").removeAttr('disabled'); 
       document.getElementById("showPasswordMessage").innerHTML=xmlhttp.responseText; 
       $("#showPasswordMessage").show(); 
      } 
     } 

     xmlhttp.open("GET", url, true); 
     xmlhttp.send(); 
}); 
    }); 
</script> 

我這個

警報嘗試（$（」 DIV [名稱=率] '）ATTR（' ID「））;

但它每次給0。

Answer 1

只使用$(this)你click處理程序中，如：

$(".rate").on("click", function() { 
    //use $(this) -- this points to the element you clicked on 
    alert($(this).attr("id")); //alerts the div's id 
    // Display the dialog 
    rateDialog.dialog("open"); 
    //alert($('div[name=rate]').attr('id'));   
}); 

Answer 2

您可以使用this.id或event.target.id：this指當前元素。

$(".rate").on("click", function(event) { 
    // Display the dialog 
    rateDialog.dialog("open"); 
    alert(this.id); //event.target.id 
}); 

Answer 3

使用時只需將當前對象this關鍵字

var id = $(this).attr('id');