整理

整理一些平时用过的基础的但是有时还是会去查资料才知道的东西

一、css

1. 多出文字省略号

.ellipsis{
    overflow:hidden;
    text-overflow:ellipsis;
}

效果：

2. 渐变
   参考：css3渐变

//按钮的渐变
.buttonbg {
        background: -webkit-linear-gradient(to right, #1A6BFC , #50BBEE); /* Safari 5.1 - 6.0 */
        background: -o-linear-gradient(to right, #1A6BFC , #50BBEE); /* Opera 11.1 - 12.0 */
        background: -moz-linear-gradient(to right, #1A6BFC , #50BBEE); /* Firefox 3.6 - 15 */
        background: linear-gradient(to right, #1A6BFC , #50BBEE); /* 标准的语法 */
    }

效果

3.表格自动换行

一开始以为是汉字和数字在同一行导致的

给td加上“word-break:break-all”

4. 去掉type=number的inpu默认样式
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
-webkit-appearance: none;
appearance: none;
margin: 0;
}

二、js

1. 防止click冒泡
   stopPropagation()
   用的地方：
   填写订单选择地址时也可以修改或删除，点击修改或删除时会冒泡，触发选择操作

<ion-col col-1>
              <ion-icon large color="secondary" name="ios-create-outline" (click)="$event.stopPropagation();alteraddress(address)"></ion-icon>
            </ion-col>
            <ion-col col-1>
              <ion-icon large color="danger" name="ios-trash-outline" (click)="$event.stopPropagation();deleteaddress(address.address_id,i)"></ion-icon>
            </ion-col>

2. 正则表达式
参考：JavaScript正则表达式
用法：表达式规则.test(待匹配的字符串);
例如检测手机号码：

	if(!(/^1[34578]\d{9}$/.test(this.mobile))){
      this.native.showToastTips("手机号码有误，请重填!");
      return false; 
    }

三、Ionic属性、事件

1. fullscreen:占满屏幕
   例如：<ion-content fullscreen></ion-content>可以让ion-content占满屏幕，就算上面有ion-navbar之类的也会是挡住不是挤下来
   参考Content

2. (ionScroll)：页面滑动监听
   例如：<ion-content (ionScroll)="scrollToTop($event)"></ion-content>
   参考Content

3. [innerHtml]：显示纯html数据
   例如：<div [innerHTML]="goodsdetail.goods_content" ></div>

四、正则

1.版本号正则
/^(0|([1-9][0-9]*))(\.(0|([1-9][0-9]*)))*$/
可匹配：

0.1
12345.5667.8999
1.2.3.4.5

0//这个其实不应该被匹配到