Response title
This is preview!
Memory leak load() empty() named functions
in Using jQuery
•
11 years ago
I am wondering if I use jquery to load() into a div the following section of code
will empty() remove the named functions and the anonomous functions that are attached as event handlers.
Or will this cause a memory leak. Or Should the click handlers be only downloaded once.
After I do the empty() I can still run the named function sleep() 'see code below ' in the console.
I do
$("#grid").load("grids/roles.php");
and then
$("#grid").empty();
This is done a 100 times a day.
This is roles.php
<?php
echo
"<div style='width:980px;'>
<form id='formID' method='post' action='submit.action'>
<table style='width:980px;'>
<tr>
<td style='width:700px;vertical-align:top;'>
<div id='summary_tabs' >
<ul>
<li><a href='#summary_tabs_1'>Template</a></li>
</ul>
<div id='summary_tabs_1' >
<button id='t_next_1' class='btn_nav_for' rel='2'>Next</button>
<div id='template_accordion' class='basic'>
<h3><a href='#'>Templates</a></h3>
<div>
<fieldset>
<table style='width:100%'>
<tr>
<td style='vertical-align:top;width:100%'>
<label style='display:block' for='1_1_template'>Templates</label>
<select title='Please Choose a template' multiple='multiple' type='text' name='1_1_template' id='1_1_template' >
<option value='0' selected='selected'>No Template</option>
<option value='US' >Us All Template</option>
<option value='Canada' >Canada All Template</option>
<option value='Ohio' >Ohio Template</option>
</select>
</td>
</tr>
</table>
</fieldset>
</div>
<h3><a href='#' title='The type of list'>Type</a></h3>
<div>
<fieldset>
<table style='width:100%'>
<tr>
<td style='vertical-align:top;width:100%'>
<label style='display:block' for='1_2_type'>Type</label>
<select title='Please Choose a type' multiple='multiple' type='text' name='1_2_type' id='1_2_type' >
<option value='0' selected='selected'>No Type</option>
<option value='telephone' >Telephone</option>
<option value='email' >Email</option>
<option value='zip4' >Zip Plus 4</option>
<option value='nopo' >No PO's</option>
</select>
</td>
</tr>
</table>
</fieldset>
</div>
</div>
<button id='b_next_1' class='btn_nav_for' rel='2'>Next</button>
</div>
</div>
";
echo
<<<EOT
<script type="text/javascript">$(document).ready( function() {
$("#template_accordion").accordion({
fillSpace: true
});var query_tabs = $('#summary_tabs').tabs({show: function(event, ui) { setTimeout ( "resize_summary_grids()", 500 ) }});$('.btn_nav_back').button({
icons: {
primary: 'ui-icon-arrowthickstop-1-w'
}});
$('.btn_nav_for').button({
icons: {
secondary: 'ui-icon-arrowthickstop-1-e'
}});
$('.btn_nav_for, .btn_nav_back').click(function() {
$('#div_refresh').block(
{
timeout: 3000,
message: 'Working',
css: {
border: 'none',
padding: '15px',
backgroundColor: '#000',
'-webkit-border-radius': '10px',
'-moz-border-radius': '10px',
opacity: .5,color: '#fff'
} });
query_tabs.tabs('select', $(this).attr("rel"));
return false;
});
});function sleep(milliSeconds){
var startTime = new Date().getTime(); // get the current time
while (new Date().getTime() < startTime + milliSeconds); // hog cpu
}</script>
</td>
<td style='vertical-align:top;'>
<div class = "ui-widget-content ui-corner-all">
<h3 style="text-align: center;" class = "ui-widget-header">Summary</h3>
<div>
<div id='div_refresh' style= 'text-align:center;padding:7px' class = "ui-widget ui-widget-content ui-corner-all">
<button style='display:block;' id='btn_refresh'>Update Count</button>
19,000,000 recs
</div>
<div id='div_refresh' style= 'padding:10px' class = "ui-widget ui-widget-content ui-corner-all">
<ul id="summary_tree" class="filetree">
</ul>
</div>
</div>
</div>
</td>
</tr>
</table>
</form>
</div>
EOT;
?>
Jon
1