第一组:杨昊 Angular js双重循环获取父级下标$index
在显示数据时可能遇到使用ng-repeat的情况,同时我们可能需要拿到某一级数组的当前字段值,这时可以用$index来取值。
$index可以看做数组当前值的下标,<div ng-repeat=”e in list track by $index ”></div>中,e的值等于list[$index]。
而在遇到ng-repeat嵌套的情况,可以用$parent.$index来取值。
注意:$index需要慎重使用,在给ng-repeat加上过滤器的情况下
利用$index取值可能与上图中的item的值不匹配(过滤后的数组可以算一个新数组,长度发生了变化,items[$index]不一定是原数组当前下标的值)。
实例:如下图所示,直接获取父级下标,只有两个ng-repeat写在一起的时候,使用 $parent.$index即可获取,若每多一级ng-if之类的判断条件,则接着在往上一级寻找即可。
第二组:叶佳意 JQuery获取节点的兄弟,父级,子级元素的方法
jQuery.parent(expr),找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class")
jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素
jQuery.children(expr).返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点
jQuery.contents(),返回下面的所有内容,包括节点和文本。这个方法和children()的区别就在于,包括空白文本,也会被作为一个
jQuery对象返回,children()则只会返回节点
jQuery.prev(),返回上一个兄弟节点,不是所有的兄弟节点
jQuery.prevAll(),返回所有之前的兄弟节点
jQuery.next(),返回下一个兄弟节点,不是所有的兄弟节点
jQuery.nextAll(),返回所有之后的兄弟节点
jQuery.siblings(),返回兄弟姐妹节点,不分前后
jQuery.find(expr),跟jQuery.filter(expr)完全不一样。jQuery.filter()是从初始的jQuery对象集合中筛选出一部分,而jQuery.find()的返回结果,不会有初始集合中的内容,比如$("p"),find("span"),是从<p>元素开始找<span>,等同于$("p span").
第三组:吴景霞 Observer设计模式简介
上面的例子显然能完成我们之前描述的工作,但是却并不够好。现在假设热水器由三部分组成:热水器、警报器、显示器,它们来自于不同厂商并进行了组装。那么,应该是热水器仅仅负责烧水,它不能发出警报也不能显示水温;在水烧开时由警报器发出警报、显示器显示提示和水温。
这时候,上面的例子就应该变成这个样子:
// 热水器
// 烧水
public class Heater {
private int temperature;
private void BoilWater() {
for (int i = 0; i <= 100; i++) {
temperature = i;
}
}
}
// 警报器
public class Alarm {
private void MakeAlert(int param) {
Console.WriteLine("Alarm:嘀嘀嘀,水已经 {0} 度了:", param);
}
}
// 显示器
public class Display {
private void ShowMsg(int param) {
Console.WriteLine("Display:水已烧开,当前温度:{0}度。", param);
}
}
这里就出现了一个问题:如何在水烧开的时候通知报警器和显示器?在继续进行之前,我们先了解一下Observer设计模式,Observer设计模式中主要包括如下两类对象:
Subject:监视对象,它往往包含着其他对象所感兴趣的内容。在本范例中,热水器就是一个监视对象,它包含的其他对象所感兴趣的内容,就是temprature字段,当这个字段的值快到100时,会不断把数据发给监视它的对象。
Observer:监视者,它监视Subject,当Subject中的某件事发生的时候,会告知Observer,而Observer则会采取相应的行动。在本范例中,Observer有警报器和显示器,它们采取的行动分别是发出警报和显示水温。
在本例中,事情发生的顺序应该是这样的:
- 警报器和显示器告诉热水器,它对它的温度比较感兴趣(注册)。
- 热水器知道后保留对警报器和显示器的引用。
- 热水器进行烧水这一动作,当水温超过95度时,通过对警报器和显示器的引用,自动调用警报器的MakeAlert()方法、显示器的ShowMsg()方法。
类似这样的例子是很多的,GOF对它进行了抽象,称为Observer设计模式:Observer设计模式是为了定义对象间的一种一对多的依赖关系,以便于当一个对象的状态改变时,其他依赖于它的对象会被自动告知并更新。Observer模式是一种松耦合的设计模式。
实现范例的Observer设计模式
我们之前已经对委托和事件介绍很多了,现在写代码应该很容易了,现在在这里直接给出代码,并在注释中加以说明。
using System;
using System.Collections.Generic;
using System.Text;
namespace Delegate {
// 热水器
public class Heater {
private int temperature;
public delegate void BoilHandler(int param);
//声明委托
public event BoilHandler BoilEvent;
//声明事件 // 烧水
public void BoilWater() {
for (int i = 0; i <= 100; i++) {
temperature = i;
if (temperature > 95) {
if (BoilEvent != null) {
//如果有对象注册
BoilEvent(temperature);
//调用所有注册对象的方法
}
}
}
}
}
// 警报器
public class Alarm {
public void MakeAlert(int param) {
Console.WriteLine("Alarm:嘀嘀嘀,水已经 {0} 度了:", param);
}
}
// 显示器
public class Display {
public static void ShowMsg(int param) {//静态方法
Console.WriteLine("Display:水快烧开了,当前温度:{0}度。", param);
}
}
class Program {
static void Main() {
Heater heater = new Heater();
Alarm alarm = new Alarm();
heater.BoilEvent += alarm.MakeAlert;
//注册方法
heater.BoilEvent += (new Alarm()).MakeAlert;
//给匿名对象注册方法
heater.BoilEvent += Display.ShowMsg;
//注册静态方法
heater.BoilWater();
//烧水,会自动调用注册过对象的方法
}
}
}输出为:Alarm:嘀嘀嘀,水已经96度了:Alarm:嘀嘀嘀,水已经96度了:Display:水快烧开了,当前温度:96度。
第四组:傅云 如何制作网页提示框边上的红圈提示
例:
- 建一个CSS
.circle {
right: 10px;
top: 0px;
border-radius: 50%;
width: 16px;
height: 16px;
line-height: 16px;
text-align: center;
color: #ffffff;
background-color: #ff0000;
}
- 在div中加入需要显示的文字或数字或动态获取数据
<div class="circle" id="AbnormalCount">0</div>
第五组:王颢 Winform中的TextBox的小技巧
1. 一些常用属性
this.textBox5.PasswordChar = '@'; //密码的样式
this.textBox5.UseSystemPasswordChar = true; //如果这个属性为true,则密码就和系统默认的密码样式相同,而PasswordChar属性不起作用.
this.textBox5.Multiline = true; //多行显示
this.textBox5.WordWrap = true; //自动换行
this.textBox5.ScrollBars = ScrollBars.Vertical; //显示垂直滚动条。ScrollBars的枚举值之一。
this.textBox5.MaxLength = 100; //在文本框中输入的最大字符数。
2. 实现自动完成功能,提高用户体验
想实现自动完成,就必须明白三个属性:
AutoCompleteSource属性: 设置自动完成的来源。此属性的值为AutoCompleteSource枚举值之一
AutoCompleteMode属性:设置自动完成的显示模式。此属性的值为AutoCompleteMode枚举值之一
AutoCompleteCustomSource属性:自定义完成来源。当AutoCompleteSource属性值为CustomSource时,此属性才起做用。属性值为AutoCompleteStringCollection集合对象,可以通过AutoCompleteCustomSource属性这个集合。
可以通过直接属性值来实现自动完成,也可以用代码实现,用代码如下:
AutoCompleteStringCollection myCutomSource = new AutoCompleteStringCollection();
myCutomSource.AddRange(new string[] {
"成都市东门",
"成都市北门",
"成都市西门",
"成都市南门"
});
this.textBox5.AutoCompleteSource = AutoCompleteSource.CustomSource;
this.textBox5.AutoCompleteMode = AutoCompleteMode.SuggestAppend;
this.textBox5.AutoCompleteCustomSource = myCutomSource;
3. TextBox控件中的字符在输入同时立即转换为大写或小写
方法一:通过CharacterCasing属性来实现。此属性默认的值为Normal,意思是字符的大小写不会改变。还有2个属性值:Upper和Lower。
方法二:通过TextBox的KeyPress事件实现
private void textBox3_KeyPress(object sender, KeyPressEventArgs e)
{
if (char.IsLower(e.KeyChar))
{
textBox3.SelectedText = char.ToUpper(e.KeyChar).ToString();
e.Handled = true;
}
}
4. 验证用户输入,增加用户体验
基本的思路是:首先,使用控件的Validating事件来验证用户的输入。其次,当输入值不符合要求时,用ErrorProvider控件通知用户或者 用MessageBox以弹出对话框的形式通知用户。显然用RrrorProvider控件通知用户更具用户体验性。
……
……
……
详情参考doc文档