我正在使用jquery加载一个jsp。我有多个按钮。在单击时,我正在进行一个jquery调用,该调用将在对话框中加载一个jsp。我希望每次在jquery对话框内的jsp加载时都执行文档就绪功能。逐步说明:
这是一个jQuery函数,每次单击速率时,该函数就会在对话框中加载ratingDialog.jsp。
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函数被执行。就我而言,它只执行一次(第一次在对话框中加载)
如何将文档就绪代码移至对话框回调中?
var rateDialog; $('<div id="ratingloaderDiv"></div>') .load("ratingDialog.jsp", function() { rateDialog = $(this).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); // Document ready $(".rateStar").show(); $(".rateCls").rating(); alert('hi'); } }); });
将对话框调用移至您的加载回调也可以确保它在检索到文件之前不会运行。