【发布时间】:2015-04-11 06:26:04
【问题描述】:
我正在使用 jquery 加载 jsp。我有多个按钮。单击时,我正在进行一个 jquery 调用,它在对话框中加载一个 jsp。我希望每次加载 jquery 对话框中的 jsp 时都执行文档就绪功能。 一步一步的解释:
这是每次点击率时在对话框中加载 ratingDialog.jsp 的 jquery 函数。
function openRatingDialog() {
var rateDialog = $('<div id="ratingloaderDiv"></div>')
.load("ratingDialog.jsp").dialog({
autoOpen: true,
minHeight:275,
width: 400,
height: 350,
open: function( event, ui ) {
$("#showDialogMessage").hide();
$('#reviewArea').val('');
$('#source').attr('checked', false);
$('#destination').attr('checked', false);
function openRatingDialog() {
var rateDialog = $('<div id="ratingloaderDiv"></div>')
.load("ratingDialog.jsp").dialog({
autoOpen: true,
minHeight:275,
width: 400,
height: 350,
open: function( event, ui ) {
$(".rateCls").rating();
$("#showDialogMessage").hide();
$('#reviewArea').val('');
$('#source').attr('checked', false);
$('#destination').attr('checked', false);
$("#submit").click(function(e) {
$("#showDialogMessage").hide();
var index = sessionStorage.getItem("history_index");
alert(index);
alert('submit clicked');
alert(this.id);
var rating = jQuery('#starVin .star:checked').val();
var review = $("#reviewArea").val();
var ratingDetails;
if($('#source').is(":checked")&& $('#destination').is(":checked")) {
ratingDetails = "overallRating";
}
else if ($('#source').is(":checked"))
{
ratingDetails = $("#source").val();
}
else if ($('#destination').is(":checked"))
{
ratingDetails = $("#destination").val();
}
else
{
ratingDetails = "vendorRating";
}
var xmlhttp;
$("#submit").prop('disabled',true);
var url="rate?index="+index+"&rating="+rating+"&review="+review+"&ratingDetails="+ratingDetails;
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("showDialogMessage").innerHTML=xmlhttp.responseText;
$("#showDialogMessage").show();
$("#submit").removeAttr('disabled');
if ($("#showDialogMessage:contains('Thanks')").length > 0) {
$("#"+index).hide();
$("#msg"+index).show();
}
}
}
xmlhttp.open("POST", url, true);
xmlhttp.send();
});
}
});
}
}
});
}
$(document).ready(function() {
var index ;
$(".rate").on("click", function() {
// Display the dialog
openRatingDialog();
index = this.id;
});
这是 ratingDialog.jsp
<link rel="stylesheet" href="dist/jquery.rating.css">
<div id="rateDialog" class="rateDialog" style="height:250px;width:500px;" title="Rating">
<div id="showDialogMessage"></div>
<p style="font-size:15px;color:black;margin:5px 0px 0px 10px;"><label>Rate your overall satisfaction:</label></p>
<div id="starVin" style="display:block;">
<input id="rateStar" type="radio" name="rating" value="1" class="rateCls star"/>
<input id="rateStar" type="radio" name="rating" value="2" class="rateCls star" />
<input id="rateStar" type="radio" name="rating" value="3" class="rateCls star"/>
<input id="rateStar" type="radio" name="rating" value="4" class="rateCls star"/>
<input id="rateStar" type="radio" name="rating" value="5" class="rateCls star"/>
</div>
<br/>
<p style="font-size:15px;color:black;margin:5px 0px 0px 10px;"><label>Please provide your review: </label></p>
<textarea id="reviewArea" name="reviewArea" rows="5"></textarea>
<p style="font-size:15px;color:black;margin:5px 0px 0px 10px;"><label><input type="checkbox" id="source" value="source" name="source"> Rating specific to source pincode</label></p>
<p style="font-size:15px;color:black;margin:5px 0px 0px 10px;"><label><input type="checkbox" id="destination" value="destination" name="destination"> Rating specific to destination pincode</label></p>
<input id="submit" type="submit" value="Submit" style="margin : 18px 0px 0px 93px;"/>
</div>
<script src = "js/jquery.rating.js"></script>
</script>
每次 ratingDialog 加载时,我都希望执行它的 document.ready 函数。就我而言,它只执行一次(第一次在对话框中加载)
【问题讨论】:
-
ready是一个事件。它发生一次(每页加载)。你不能做任何事情让它发生不止一次。但是,您可以做一千零一件事来让代码多次执行以响应该事件。 -
您是否阅读过“脚本执行”部分,here?尽管它不涵盖您的确切用例,但它是相关的。尝试对您的
ratingloaderDiv进行硬编码,而不是在每个.load()处重新创建它。 -
此外,您可以安全地从加载的内容中删除
$(document).ready(function() {...})包装器,因为它不可能在页面的ready事件之前运行。 -
问题是我试图在对话框中添加星级。单选按钮第一次变成了星星。但是,如果我们再次单击速率按钮,单选按钮不会转换为星号。单选按钮出现一会儿然后消失。我正在使用这个插件fyneworks.com/jquery/star-rating
-
我已经确定了问题所在。由于单选按钮的名称相同,因此将总星数放在第一个对话框中。所以现在问题被简化为每次加载 jsp 时为单选按钮提供不同的名称。我已经单独添加了这个问题。请帮忙。我从过去的 2-3 小时就被困在这上面了。 stackoverflow.com/questions/29575594/…
标签: javascript jquery jsp document-ready