Error when trying to create Jquery button
I'm not really sure what i'm doing wrong because I have done this will success before.
I have some html code being added dynamically
...<td><label><input type=\"checkbox\" checked=\"checked\" class=\"Activechk form-contractor-active\" />Active</label></td>"...
Then I execute this JQuery: $(".Activechk").button();
I am getting an "Out of Memory" Error"Stack Over Flow" Error
Does this ring any bells? Becuase i'm stumped...
Update: according to fire bug error is at line 1599 of Jquery 1.4.2
Surrounding code:
1594 if ( !eventHandle ) {
1595 elemData.handle = eventHandle = function() {
1596 // Handle the second event of a trigger and when
1597 // an event is called after a page has unloaded
1598 return typeof jQuer开发者_开发百科y !== "undefined" && !jQuery.event.triggered ?
1599 jQuery.event.handle.apply( eventHandle.elem, arguments ) :
1600 undefined;
1601 };
1602 }
I looked at it a little more closely and am editing this answer.
It appears that the button function needs a label with a special attribute called "for" with a value that is the same as the id of the input element which will become the button.
In the below example, I observed that the label/input relationship in your sample output was different from this Label.
The below example is based on the documentation found at: http://docs.jquery.com/UI/Button
<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {
$(".Activechk").button();
});
</script>
</head>
<div id="problem">
<label><input type="checkbox" checked="checked" class="Activechk form-contractor-active" />Active One</label>
<br />
<label><input type="checkbox" checked="checked" class="Activechk form-contractor-active" />Active Two</label>
<br />
<label><input type="checkbox" checked="checked" class="Activechk form-contractor-active" />Active Three</label>
</div>
<hr />
<div id="solution">
<p>Inputs can be somewhere else on the DOM but cannot be child elements of labels. The buttons appear where the labels are:</p>
<!-- input elements -->
<input id="inputSolutionOne" type="checkbox" checked="checked" class="Activechk form-contractor-active" />
<input id="inputSolutionTwo" type="checkbox" checked="checked" class="Activechk form-contractor-active" />
<input id="inputSolutionThree" type="checkbox" checked="checked" class="Activechk form-contractor-active" />
<!-- label elements -->
<table>
<tr><td>
<label for="inputSolutionOne">Active One</label>
</td></tr><tr><td>
<label for="inputSolutionTwo">Active Two</label>
</td></tr><tr><td>
<label for="inputSolutionThree">Active Three</label>
</td></tr>
</table>
</div>
</body>
</html>
加载中,请稍侯......
精彩评论