首页 > Web开发 > 详细

PHP.TP框架下商品项目的优化4-优化商品添加表单js

时间:2017-06-08 00:57:16      阅读:426      评论:0      收藏:0      [点我收藏+]

优化商品添加表单js

思路

1、制作五个按钮

2、下面五个table

3、全部隐藏,点击则显示

4、点击第几个按钮就显示第几个table

具体操作

1、添加按钮

技术分享

技术分享

2、添加五个table并添加class隐藏后面四个

style="display:none"  ->隐藏

class="tab_table"  ->样式名,方便js操作

技术分享

技术分享

技术分享

技术分享

3、添加JS代码绑定点击事件【add.html的最下面】

/******切换代码******/
        $("#tabbar-div p span").click(function(){
            //点击的第几个按钮
            var i = $(this).index();
            //先隐藏所有的table
            $(".tab_table").hide();
            //显示第i个table
            $(".tab_table").eq(i).show();
            //先取消原按钮的选中状态
            $(".tab-front").removeClass("tab-front").addClass("tab-back");
            //设置当前按钮选中
            $(this).removeClass("tab-back").addClass("tab-front");
        });

   

 

 

 

 

 

 

PHP.TP框架下商品项目的优化4-优化商品添加表单js

原文:http://www.cnblogs.com/zixuanfy/p/6959788.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!