我有多个按钮。点击按钮即可出现一个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>
我试过这个
警报($(&#39; DIV [名称=率]&#39;。)ATTR(&#39; ID&#39;));
但每次都给0。
答案 0 :(得分:2)
只需在$(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'));
});
答案 1 :(得分:2)
您可以使用this.id
或event.target.id
:this
引用当前元素。
$(".rate").on("click", function(event) {
// Display the dialog
rateDialog.dialog("open");
alert(this.id); //event.target.id
});
答案 2 :(得分:0)
只需使用当前对象this
关键字
var id = $(this).attr('id');