首页前端开发HTMLWeb前端页面跳转并取到值

Web前端页面跳转并取到值

时间2024-01-24 20:15:35发布访客分类HTML浏览421
导读:收集整理的这篇文章主要介绍了Web前端页面跳转并取到值,觉得挺不错的,现在分享给大家,也给大家做个参考。 记录一下(从A页面跳转到B页面,并将B页面的值取到赋到A页面上显示)先来举一个栗子; 这个是A页面这是B页面通过点击A页面上...
收集整理的这篇文章主要介绍了Web前端页面跳转并取到值,觉得挺不错的,现在分享给大家,也给大家做个参考。

记录一下

(从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 = 'div class="accessLOG">
    div class="val-log">
    ' + Remark + '/div>
    div class="time-log">
    ' + AddTimeStr + '/div>
    /div>
    ';
                $(".js_noJilu").hide();
            $(".js_rizhi").PRepend(html)        }
     div class="detailss-BTn js_openPage" data-url="/OACustomer/AddLogView?Id=@detail.Id">
    添加日志/div>
    

 

公共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"/>
    div 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>
    /div>
    /form>
    

取完数据,点击提交就会关闭一个页面即B页面,回到上一个页面即A页面。最后取到了数据显示在A页面的红色框处了。

以上所述是小编给大家介绍的Web前端页面跳转并取到值,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

上一篇: 解决html5中video标签无法播放mp...下一篇:HTML5新特性 多线程(Worker Sha...猜你在找的html5相关文章 关于移动端h5开发相关内容总结2022-05-17html5教程-学表单的第二天2018-12-10html5教程-HTML5浏览器支持2018-12-10html5教程-HTML5智能表单2018-12-10html5教程-微信H5使用resLoader实现加载页效果2018-12-10html5教程-day01-初级-JS0-热身运动JS入门教程2018-12-10html5教程-html5shiv.js和respond.min.js2018-12-10html5教程-不同浏览器对于html5 audio标签和音频格式的兼容性2018-12-10html5教程-使用Html5实现手风琴案例2018-12-10html5教程-html5笔记2018-12-10 其他相关热搜词更多phpjavapython程序员load

若转载请注明出处: Web前端页面跳转并取到值
本文地址: https://pptw.com/jishu/585700.html
HTML5新特性 多线程(Worker SharedWorker) 解决html5中video标签无法播放mp4问题的办法

游客 回复需填写必要信息