AppCan頁(yè)面跳轉(zhuǎn)和表單提交的實(shí)現(xiàn)方法
使用a標(biāo)簽實(shí)現(xiàn)頁(yè)面跳轉(zhuǎn)最常用的方法是使用a標(biāo)簽來(lái)實(shí)現(xiàn)頁(yè)面的跳轉(zhuǎn)。通過(guò)設(shè)置a標(biāo)簽的href屬性,可以指定跳轉(zhuǎn)到的頁(yè)面地址。在A(yíng)ppCan中,給a標(biāo)簽添加class"uinvisible"可以去除下劃線(xiàn)。
使用a標(biāo)簽實(shí)現(xiàn)頁(yè)面跳轉(zhuǎn)
最常用的方法是使用a標(biāo)簽來(lái)實(shí)現(xiàn)頁(yè)面的跳轉(zhuǎn)。通過(guò)設(shè)置a標(biāo)簽的href屬性,可以指定跳轉(zhuǎn)到的頁(yè)面地址。在A(yíng)ppCan中,給a標(biāo)簽添加class"uinvisible"可以去除下劃線(xiàn)。
優(yōu)點(diǎn):
- 簡(jiǎn)單,代碼量少
缺點(diǎn):
- 鏈接的顏色是藍(lán)色的,用戶(hù)體驗(yàn)差
如果希望在首頁(yè)以外的頁(yè)面中,鏈接的顏色為灰色,在首頁(yè)中鏈接的顏色為深藍(lán)色,可以使用以下代碼:
```html
.inactive {
color: gray !important;
}
.active {
color: blue !important;
}
```
使用JavaScript實(shí)現(xiàn)頁(yè)面跳轉(zhuǎn)
使用JavaScript的onclick事件可以實(shí)現(xiàn)頁(yè)面的跳轉(zhuǎn)。在A(yíng)ppCan中,可以使用()方法來(lái)打開(kāi)一個(gè)新窗口。
```javascript
onclick"({
name: 'index',
dataType: 0,
aniId: 1,
animDuration: 500,
data: '',
extraInfo: {
opaque: true
}
})"
```
()方法的參數(shù)解釋?zhuān)?/p>
- name:新窗口的名稱(chēng),如果窗口存在直接打開(kāi),如果不存在先創(chuàng)建然后打開(kāi)
- data:新窗口填充的數(shù)據(jù)
- dataType:新窗口填充的數(shù)據(jù)類(lèi)型,0表示URL,1表示HTML數(shù)據(jù)
- aniId:動(dòng)畫(huà)類(lèi)型ID,0表示無(wú)動(dòng)畫(huà),1表示從左向右推入,2表示從右向左推入,3表示從上向下推入,4表示從下向上推入,5表示淡入淡出,6表示左翻頁(yè),7表示右翻頁(yè),8表示水波紋,9表示由左向右切入,10表示由右向左切入,11表示由上向下切入,12表示由下向上切入,13表示由左向右切出,14表示由右向左切出,15表示由上向下切出,16表示由下向上切出
- type:窗口類(lèi)型,0表示普通窗口,1表示OAuth窗口,2表示加密頁(yè)面窗口,4表示強(qiáng)制刷新,16表示view不透明,32表示隱藏的window,64表示等待popOver加載完畢后顯示,128表示支持手勢(shì),256表示標(biāo)記open的window上一個(gè)window不隱藏,512表示標(biāo)記open的浮動(dòng)窗口用友打開(kāi)wabapp
- width:要打開(kāi)的窗口寬度,請(qǐng)傳入0
- height:要打開(kāi)的窗口高度,請(qǐng)傳入0
- animDuration:動(dòng)畫(huà)執(zhí)行時(shí)間
- extraInfo:擴(kuò)展參數(shù),設(shè)置值時(shí),animDuration參數(shù)必須設(shè)置
例如,要實(shí)現(xiàn)一個(gè)按鈕點(diǎn)擊跳轉(zhuǎn)到的效果,可以使用以下代碼:
```html
name: 'index', dataType: 0, aniId: 1, animDuration: 500, data: '', extraInfo: { opaque: true } })">跳轉(zhuǎn)到首頁(yè)
```
這種方法雖然代碼比較復(fù)雜,但是效果很好。
簡(jiǎn)化代碼
如果每個(gè)功能的跳轉(zhuǎn)div都設(shè)置一個(gè)id,并且id的名稱(chēng)就是要跳轉(zhuǎn)頁(yè)面的名稱(chēng),可以進(jìn)一步簡(jiǎn)化代碼。
例如,要實(shí)現(xiàn)跳轉(zhuǎn)到的功能,可以使用以下代碼:
```html
```
這樣就可以通過(guò)點(diǎn)擊具有相應(yīng)id的div實(shí)現(xiàn)頁(yè)面的跳轉(zhuǎn)了。在實(shí)際應(yīng)用中,可以根據(jù)需要給不同的功能添加相應(yīng)的id,并為每個(gè)id編寫(xiě)對(duì)應(yīng)的跳轉(zhuǎn)邏輯。