iframe中jquery点击左边后台动态加载的树 右面上面追加添加tab标签栏

$(".menu li>a").click(function(){

var myobj=$(this).parent()

myobj.addClass("menu_on").siblings().removeClass("menu_on")

myobj.find(".subMenu").slideDown().parent().siblings().find(".subMenu").slideUp ()

在这一行下面，把菜单追加到topMenu里

$('.topMenu').append('<a href="'+$(this).attr("herf")+'"><span>$(this).text()</span><i></i></a>')

})

不过追上加上去的菜单是没有绑定事件的，你再选择新加的这个节点，加上点击事件

$('.topMenu a').last().click(function(){

//处理点击事件

})

一、首先想好一个需要tab切换效果的主题，这里我选择学生查看任课教师对他上交的作业的批改情况，需要查看的包括老师给自己作业的分数和评语，老师对全班作业的点评以及发布哪些同学的作业可以参考，最后能看到自己本次作业提交了什么内容，根据这个主题，进行三种内容的切换。

二、拖拽三个矩形，调整成高35，宽110的按钮样式，并列排好，在按钮上分别写上“作业批阅结果”“作业总体点评”“我的作业内容”，然后在按钮的下方再拖拽一个矩形，我们将在矩形区域显示不同的内容。

三、在矩形区域添加第一个按钮要显示的内容，然后选中内容和矩形，右键转换为动态面板！

注意：为什么不直接拖拽一个动态面板呢？直接拖拽也是可以的，但是先添加动态面板再往里面写内容的鼠标 *** 作比这么做要麻烦，这里提供一种便捷方法，后面还会陆续提到其他的便捷方式来提高原型制作效率。

四、转换成动态面板后，双击面板，在d出的动态面板管理对话框中对面板进行命名“学生查看已批阅作业”，然后对面板的状态1重命名为“作业批改结果”，代表这个状态里面包含的作业批改结果相关信息。

五、接下来，还要在这个面板管理对话框中增加两个面板状态，分别用来显示作业总体点评信息和学生的作业内容信息，并按照步骤4进行重命名。

六、下面给步骤5新添加的两个状态添加显示内容，再axure界面的右下方有一个动态面板管理区，可以看到我们刚刚做好的动态面板的名字以及所包含的所有状态，双击状态“作业总体点评”添加内容，然后重复本步骤将所有的内容添加好。

七、下面是最关键的设置了，点击按钮显示对应的内容

首先选择按钮“作业批阅结果”，在页面的右侧部件属性面板中对“onclick(点击时)”事件添加用例，在d出的用例面板中选择“设置面板状态为指定状态”，在右侧配置动作下找到刚刚我们添加的“学生查看已批阅作业”动态面板，在选择状态中指定显示第一个状态“作业批阅结果”。如果你希望点击后显示内容时有点特效，在进行进行动画中进行设置

八、接下来设置第二个按钮“作业总体点评”，按照步骤6设置显示动态面板的状态2“作业总体点评”，然后设置第三个按钮。

九、生成原型，在浏览器中预览这个TAB切换效果吧，生成原型时可以选择浏览器，不过有些浏览器需要一些设置，如chrome，这里选择IE

十、在IE中我们点击三个按钮，看到内容已经随着按钮变化了，而且还有淡入淡出的效果哦

layuitab选项卡标题栏右边添加按钮方法：

1、打开编译器，来到代码主要部分，点击进入编译。

2、使用表格中的toolbar属性，字段里面添加toolbar属性。

3、给toolbar进行js赋值，调用监听事件，即可添加按钮。

---