Calling jQuery.load in an Object Literal
I am trying to learn some of the开发者_如何学JAVA more advanced java scripting patterns while using jQuery to ease some of the ajax difficulty with jQuery. However, I keep running in to problem that throws no errors.
I want to be able to call the ajaxCalls.setup({}) and have it replace the defaults with the object passed to setup. I have that part working. What I seem to have problems with is the ajax call. When the callIt function runs the $(this.defaults.element).load(....) does not run or if it does it fails. I am pretty stumped. I am really just trying to learn something new. I would appreciate any help
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script>
var ajaxCalls = (function($){
var ajaxer = {
defaults:{
url:"test.php",
element:"#ajaxerizer"
},
setup:function(setup){
var defaulLengther = this.defaults
/*var l = 0;*//*bug*/
for (var key in defaulLengther)
{
if(setup.hasOwnProperty(key))
{
this.defaults[key] = setup[key];
/*l++;*//*bug*/
}
}
/*debugger*/
/*for(var i=0; i < l; i++)
{
alert(this.defaults.power);
} */
this.callIt();
},
callIt:function(){
$(this.defaults.element).load(this.defaults.url, function(){alert("success");});
},
}
return ajaxer
})(jQuery);
ajaxCalls.setup({})
</script>
</head>
<body>
<div id="ajaxerizer"></div>
</body>
</html>
Thank you for your help test.php just has this in it
<p>IT WORKED</p>
a note: in this project I intended to only use jQuery for DOM selection and aJax calls
You need to set your ajaxCalls.setup to run after the page is loaded using document.ready eg.
$(document).ready(function(){
ajaxCalls.setup({})
});
Otherwise you're trying to replace your div before the html is loaded.
精彩评论