这次给大家带来前端页面跳转并取值的实现,前端页面跳转并取值的实现的注意事项有哪些,下面就是实战案例,一起来看一下。
记录一下
(从a页面跳转到b页面,并将b页面的值取到赋到a页面上显示)
先来举一个栗子;)
这个是a页面
这是b页面
通过点击a页面上的添加日志 跳转到b页面,并将在b页面上添加的日志内容传到a页面上 红色框位置
首先引用js,我这里有引用openpage.js 自己的一个插件
//这个是放在a页面上的
//将填写的日志 返回的json数据 填充到客户详情
function dunnage(data) { //成功之后从b页面返回的数据data
var data = json.parse(json.stringify(data));
var remark = data.body.remark;//内容
var addtimestr = data.body.addtimestr;
var html = '<p class="accesslog"><p class="val-log">' + remark + '</p><p class="time-log">' + addtimestr + '</p></p>';
$(.js_nojilu).hide();
$(.js_rizhi).prepend(html)
}
<p class="detailss-btn js_openpage" data-url="/oacustomer/addlogview?id=@detail.id">添加日志</p>
公共js里面配置头部
(详细的app头部配置说明----------app配置页面头部)
a页面的头部 /oacustomer/customerdetail: { title: 客户详情, headleft: [{ foreimage: iconback, eventstring: gjj://close.page/1?jscallback=jc5wywdpbmcuc2vhcmnokck7}],
headright: [{ foreimage: icondrop, type: dropdownlist, menus: [{ iconimage: iconcontentchange, alpha: 100, text: 修改客户信息, textsize: 16, textcolor: 000000, backcolor: ffffff, eventstring: modification() }, ], }] },
b页面的头部 /oacustomer/addlogview: { title: 添加客户日志, headright: [{ text: 提交, eventstring: submit() }] }//js里配置的头部
//这是放在b页面上的
//提交
function submit() {
var mes = $(form).validtor();
if (mes) {
$.dialog.opendialogstring(mes);
return false;
}
var url = /oacustomer/submitaddlog;
$.ajax({
type: post,
url: url,
data: $(form).serialize(),
datatype: json,
beforesend: function () {
},
error: function () {
$.dialog.opendialogstring(加载失败,请重试);
},
success: function (data) {
if (data.dictjsonstatus == 200) {
//将填写的日志 返回的json数据 填充到客户详情
$.zprotocol({
type: close.page,
path: /1,
success: 'dunnage(' + json.stringify(data) + ')'
});
} else {
$.dialog.opendialogstring(data.msg);
}
}
})
}
//页面内容
<form action="/oacustomer/submitaddlog">//后台提交数据的action(submitaddlog)
<!------action 提交地址------>
<input type="hidden" value="@detail.id" name="fkoacustomer"/>
<p class="remarks">
<p><i style="color:#f00">*</i>备注留言:</p>
<p>
<textarea placeholder="请填写申请表述(必填)" class="js_inputbox" name="remark" data-tipname="备注留言" data-valid='{required:true}'></textarea></p>
</p>
</form>
相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!
推荐阅读:
怎样使用phonegap查找联系人
phonegap操作数据库详解
phonegap获取设备信息方法详解
以上就是前端页面跳转并取值的实现的详细内容。