JQUERY面向对象写法规定

编程之家收集整理的这篇文章主要介绍了JQUERY面向对象写法规定编程之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

1.定义对象

var product = {};

2.对象里面的属性方法

    var product = {
        init:function(){
            this.p = 1;
            this.sort_field = "default";
            this.sort = "";
            this.eventBind();
        },
        eventBind:function(){
            var that = this;
            $(".search_header .search_icon").click( function(){
                that.search();
            });

            $(".sort_Box .sort_list li a").click( function(){
                that.sort_field = $(this).attr("data");
                if( $(this).find("i").hasClass("high_icon")  ){
                    that.sort = "asc"
                }else{
                    that.sort = "desc"
                }
                that.search();
            });

            process = true;
            $( window ).scroll( function() {
                if( ( ( $(window).height() + $(window).scrollTop() ) > $(document).height() - 20 ) && process ){
                    process = false;
                    that.p += 1;
                    var data = {
                        kw:$(".search_header input[name=kw]").val(),
                        sort_field:this.sort_field,
                        sort:this.sort,
                        p:that.p
                    };

                    $.ajax({
                        url:common_ops.buildMUrl( "/product/search" ),
                        type:'GET',
                        dataType:'json',
                        data:data,
                        success:function( res ){
                            process = true;
                            if( res.code != 200 ){
                                return;
                            }
                            var html = "";
                            for( idx in res.data.data ){
                                var info = res.data.data[ idx ];
                                html += '<li> ' +
                                    '<a href="' + common_ops.buildMUrl( "/product/info",{ id:info['id'] } ) + '"> ' +
                                        '<i>' +
                                            '<img src="'+ info['main_image_url'] +'"  style="width: 100%;height: 200px;"/>' +
                                        '</i> ' +
                                        '<span>'+ info['name'] +'</span> ' +
                                        '<b>' +
                                            '<label>月销量' + info['month_count'] +'</label>¥' + info['price'] +'' +
                                        '</b> </a> ' +
                                    '</li>';
                            }

                            $(".proBox ul.prolist").append( html );
                            if( !res.data.has_next ){
                                process = false;
                            }
                        }
                    });
                }
            });
        },
        search:function(){
            var params = {
                kw:$(".search_header input[name=kw]").val(),
                sort_field:this.sort_field,
                sort:this.sort
            };
            window.location.href = common_ops.buildMUrl("/product/index",params);
        },
    };
调用:product.init();

3.总结

对象:var obj = {}

对象属性:this.name = "sunxiao";

对象方法调用:this.funcname();

对象方法声明:

funcname:function(){

}

对象的方法之外用逗号隔开

对象的方法之内用分号隔开

总结

以上是编程之家为你收集整理的JQUERY面向对象写法规定全部内容,希望文章能够帮你解决JQUERY面向对象写法规定所遇到的程序开发问题。

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您喜欢寻找一群志同道合、互帮互助的学习伙伴,可以点击下方链接加入:
编程之家官方1群
编程之家官方2群
编程之家官方3群
编程之家官方4群

相关文章

猜你在找的jQuery相关文章

最近学习jQuery,所以就写了一个关于中国省市县/区的三级联动菜单,权当相互学习,相互促进,特此记录。 下面是嵌套js的html文件: 效果图: 以下是放在服务器的有关地名xml文件:
1 无穷滚动(无限加载)与分页的比较 现在越来越多的网站或者博客的列表页开始抛弃传统的分页技术,大致的原因在于,分页明显地增加了用户的操作行为以及页面加载等待的时间,而网页浏览者往往没什么耐心。 而无
此前在浏览一些网站的时候,发现他们网站的图片都是你“鼠标”滚到哪,图片才会加载显示。当时觉得好神奇,怎么会这么“跟手”呢。核心原理是:1 设置一个定时器,计算每张图片是否会随着滚动条的滚动,而出现在视
1.开关灯效果 &lt;!DOCTYPE html&gt; &lt;html lang=&quot;en&quot;&gt; &lt;head&gt; &lt;meta charset=&quot;U
什么是事件冒泡 &lt;div &quot;width: 200px;height: 200px;background: red;margin: 200px auto;&quot; onc
Allot Transfer $(document).ready(function() { $(&#39;input[type=radio][name=bedStatus]&#39;).change(
目录验证码实现效果如下:生成验证码的方法:生成验证码随机背景颜色在html中引用完整源码下载地址:验证码实现效果如下:生成验证码的方法:function code_draw() { var canvas_width = $('#canvas').width(); var canvas_height = $('#canvas').height(); var canvas = document.getElementById("canvas"); //获取到canvas
比如info是一个字符串变量,如果需要去该变量的值,需要使用下面的语句:语法:alert($(&quot;#&quot;+id).val());例如:使用id设置隐藏控件 $(&quot;.img&quot;).mouseover(function(event){ var html=event.target.innerHTML; //alert(html); var aid=html.match(/&amp;lt;a id=&quot;(...
微信公众号搜索 “ 程序精选 ” ,选择关注!
微信公众号搜 "程序精选"关注