开发者

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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜