精华内容
下载资源
问答
  • 一个页面上,一块区域上显示一个页面(或者文件)的内容 我是利用js和iframe标签组合来实现的。 比如我在1.html上,划分一个div区域,通过按钮,使其用来显示2.html,或者其他网站(如:百度)。 这时,我在1....

    在一个页面上,一块区域上显示另一个页面(或者文件)的内容

    我是利用js和iframe标签组合来实现的。
    比如我在1.html上,划分一个div区域,通过按钮,使其用来显示2.html,或者其他网站(如:百度)。
    这时,我在1.thml上弄一个专门显示的区域div。
    按钮的内容:
    <input name="butt" value="统计" type="button" id="change" οnclick="change()" />
    给了一个onclick事件触发js的代码。
    iframe框的内容:(注意,在这个div上还有一个父div!)
    <div class="box2">显示另外一个页面的内容
    <iframe id="ifrID" src="http://www.baidu.com" frameBorder="0" width="100%" scrolling="yes" height="100%">
    </iframe>
    </div> 
    javascript代码的内容:
    <script type="text/javascript">
    function change(){
        document.getElementById("ifrID").src="http://i.maxthon.cn"; 
    }
    </script>
    	通过点击按钮“统计“,就会执行js的代码。执行change函数,找到id为ifrID的元素,改变src的属性的值为百度网。这样就会实行跳转页面。
    效果为:

    之后:


    展开全文
  • 移动端H5页面,可以点击按钮添加列表,点击列表可以进入同一个页面,没有数据库和服务器,我是用localStorage.setItem()和getItem()实现页面间传值。 功能是:点击不同列表进入“图2”所在页面后,显示的是当前点击...
  • 第二个页面展示第一个页面中某一个记录的详情,但是详情内容不固定,有的详情是一条记录,有的详情是多条记录,不知道该怎么在第二个jsp页面显示出来。 具体的功能:第一个页面显示公司类型和每个类型下公司的...
  • 在项目过程中我们经常会用到把一个页面嵌入另外的一个页面当中去 比如以一个模态框的形式去展示 但是这个过程中而且还会涉及数据的交互 比如在列表的展示页我们希望修改和添加是通过一个页面的弹框的形式去...

    在项目过程中我们经常会用到把一个页面嵌入到另外的一个页面当中去   比如以一个模态框的形式去展示  但是这个过程中而且还会涉及到数据的交互 比如在列表的展示页我们希望修改和添加是通过一个页面的弹框的形式去进行  而不是通过直接跳转到一个对应的jsp或者一个html页面    又或者说  我们在项目的过程中对项目进行版本的升级  原有的页面设计就是通过直接跳转到一个jsp和html页面  那么这个时候我们想直接通过去嵌套进来  而且不影响其他的功能   并且不需要去做任何的代码的修改等 诸如此类的应用场景  我们又该如何的操作呢  今天我就给大家带来这种效果的实现   使用的bootstreap中的模态框实现的  之前也有用过easyui进行操作  相对的容易  所以大家可以借鉴 

          第一步:我们使用bootstreap先要对它进行有一个大概熟悉,这要我们就可以更好的使用它   出了问题也知道如何去修改  这里大家可自行下载相应的api和对应的教程

          第二步:去官方下载对应的js,css文件

          第三步:按照官方的文档和案例引入对应的js,css文件

          第四步:编写相应的demo实现想要的功能和测试

          第五步:项目的过程中使用和代码的封装

     这是我在使用任何一项技术的时候所使用的步骤  大家可借鉴   根据自己个人的能力和适合自身的情况,话不多说  开始今天的案例实现。

    找到官方的文档javascript插件中找到模态框案例

    根据官方提示注意

    1.千万不要在一个模态框上重叠另一个模态框。要想同时支持多个模态框,需要自己写额外的代码来实现。

    2.务必将模态框的 HTML 代码放在文档的最高层级内(也就是说,尽量作为 body 标签的直接子元素),以避免其他组件影响模态框的展现和/或功能。

    3.浏览器的兼容性具体太多,大家可自行查看

    现在假设你有两个jsp页面list.jsp和update.jsp两个页面  原本两个页面的功能都是独立的现在需要把update.jsp直接通过弹框的形式在list.jsp中弹出,这里我做了一个封装成一个model.jsp根据官方的案例进行封装,其中header.jsp重要是一些引入的js,css文件等

    先看model.jsp中的功能

    <%@ page contentType="text/html; charset=UTF-8"%>
    <%@ include file="../include/header.jsp"%>

    <body>
    <!-- 公用对话框1 -->
    <div class="modal fade" id="commonMaxDlg">
    <div class="modal-dialog modal-lg">
    <div class="modal-content"></div>
    </div>
    </div>

    <!-- 公用对话框2 -->
    <div class="modal fade" id="commonMinDlg">
    <div class="modal-dialog" style="width: 598px;">
    <div class="modal-content"></div>
    </div>
    </div>

    <script type="text/javascript">
    //公共对话框1
    function showPubModal(modalId,url,tdPadding){
    var dlObj = $(modalId);
    $(dlObj).find('.modal-content').empty();
    $(dlObj).modal({show: true});
    $(dlObj).find('.modal-content').load(url, function(){
    $(this).css('padding','15px');
    var tableObj = $(this).find('.ReportTable');
    $(tableObj).addClass('table table-bordered').removeClass('ReportTable');
    $(tableObj).find('td').css('padding-top',tdPadding);
    $(dlObj).css('overflow','auto');
    });
    }
    //公共对话框2
    function showPubModal2(modalId,url){
    var dlObj = $(modalId);
    $(dlObj).find('.modal-content').empty();
    $(dlObj).modal({show: true});
    $(dlObj).find('.modal-content').load(url, function(){
    $(this).css('padding','15px');
    var tableObj = $(this).find('.ReportTable');
    $(tableObj).addClass('table table-bordered').removeClass('ReportTableList');
    $(tableObj).find('td').css('padding-top','6px');
    $(dlObj).css('overflow','auto');
    });
    }

    //关闭公共对话框
    function modalToggleFun(modalId){
    $(modalId).modal('toggle'); 
    }
    //公共对话框关闭事件和打开
    function modalHiddenFun(hiddenModalId,showModalId){
    $(hiddenModalId).on('hidden.bs.modal',function(){
    $(showModalId).modal({show: true});
    });
    }
    </script>

    </body>

    list.jsp页面

    <%@ page contentType="text/html; charset=UTF-8"%>
    <%@ include file="../include/header.jsp"%>
    <script language="JavaScript" type="text/javascript">
    //add
    function clk_update(id){
    var url = 'AddAction.do?operate=add&Id="+id; 
    window.top.showPubModal('#commonMaxDlg',url,'5px');
    }

    <body>

         其他内容被我删除

         <input type="button" value="修改" οnclick="clk_update(1)">

    </body>

    update.jsp

    <%@ page contentType="text/html; charset=UTF-8" %>

    <%@ include file="../include/header.jsp"%>

    <script language="JavaScript" type="text/javascript">


    function clk_save(){
    var srvUrl = "EditAction.do?operate=save";
    var nModal = $(window.top.document).find('#commonMaxDlg');
    var frm1 = $(nModal).find('form[name=Form]');
    var nBtn = $(nModal).find('#SaveBtn');
    // 禁用按钮
    nBtn.html(' 请稍候...');
    nBtn.addClass('disabled');

    var frmStr = $(frm1).serialize();

           $.ajax({

    url : srvUrl,
    cache : false,
    type : "post",
    async : true,
    data : frmStr,
    success : function(result) {
    $(nModal).modal('hide');
    nBtn.removeClass('disabled');
    nBtn.html(' 保存');

    alert("保存成功");

                            保存成功这里我想接下这实现一种展示页面无刷新的效果,这里我们可以根据父级去找到上一条页面的值  然后通过js去实现这一条值重新的填充进去  从而达到一种无刷新的效果

    },
    error : function(request, error) {
    nBtn.removeClass('disabled');
    nBtn.html(' 保存');
    alert("操作异常");
    }
    });
    }
    </script>
    <body>
    <div class="modal-header">
    <h4 class="modal-title" id="kpitemAddLabel">编辑信息</h4>
    <div class="pull-right headerBtn">
    <a class="btn btn-default fa fa-remove" data-dismiss="modal"> 取消</a>
    <a class="btn btn-primary fa fa-check" style="margin-left: 15px;" href="javascript:clk_save()" id="SaveBtn"> 保存</a>
    </div>

    <form name="Form" id="updateForm" action="EditAction.do" method="post">

            <input type="text" name="uname"/>

    </form>

    </body>

    这样就可以实现一个简单的直接把一个页面的功能嵌套在本页面中 ,这里我只是对修改的页面中的具体实现做了一个修改,这个可根据个人情况而定,有不明白的地方可留言,希望能够解决你的问题





    展开全文
  • //当前页ajax代码 function ajaxFun() { $.ajax({ ... type : "GET", //静态页用get方法,否则服务器会抛... 另一个jsp页面代码text.jsp 21313 这样写 怎么也拿不 text.jsp的 div内容。。。也放不进去ajaxtext里
  • 我想要做一个左侧是菜单栏,然后点击菜单在右侧显示内容一个页面,并且不刷新左侧的菜单~求助各位大神~很多人都说用ajax做,但是新手没有接触过,给点例子什么的最好了~
  • 就相当于把页面一分为二,上半边是按钮,下半边是文本显示区,怎么做到呢? 我只会用form_action,点击按钮后在新窗口内打开内容 ...而且要上半边的很多按钮按下以后下半边会显示不同的内容~~ 谢谢!
    就相当于把页面一分为二,上半边是按钮,下半边是文本显示区,怎么做到呢?
    我只会用form_action,点击按钮后在新窗口内打开内容

    而且要上半边的很多个按钮按下以后下半边会显示不同的内容~~

    谢谢!
    展开全文
  • 第(1)步新建的preject已经有一个MainActivity.java文件。按上图示操作,我们需要新建的是一个名为DisplayActivity.java(自取)的Activity。这会在Layout中自动生成文件名为activity_display的XML文件。 (3)完成...

    (1)新建project,如下图所示:
    图1
    (2)此次需要页面跳转,因此我们需要两个Activity,两个XML文件。
    图2第(1)步新建的preject已经有一个MainActivity.java文件。按上图示操作,我们需要新建的是一个名为DisplayActivity.java(自取)的Activity。这会在Layout中自动生成文件名为activity_display的XML文件。

    (3)完成以上步骤后,查看左侧,应该是这样的:
    图三
    这个时候,就可以对app的两个页面(XML)进行布局了。

    (4)打开main_activity.xml(如下目录)文件。
    图四
    左侧切到design模式:
    在这里插入图片描述
    (5)选择PlainText, 直接右键拖到视图中白色区域
    在这里插入图片描述
    (6)(右侧attributes窗口)——设置id值,便于后续写代码,调整大小,设置约束(确定位置)
    在这里插入图片描述设置约束如下:
    在这里插入图片描述
    同样的Button也类似操作:拖至空白区域,选中,设置id值与约束
    在这里插入图片描述
    初步得到这样的效果图
    在这里插入图片描述
    (7)为了优化显示(不需要也可以不弄),使得文本框大小随手机界面改变。
    点击文本框,按住shift,再点击按钮,右键,点击chains。设置水平
    Horizontal chain。
    在这里插入图片描述
    点击文本框,一开始红色框内显示的是直线,我们可以双击它,知道它变成如图所示的折线。
    在这里插入图片描述

    (8) 第(7)步也可以省略。

    我们这个时候,切换到MainActivity.java文件,进行代码编写。
    在这里插入图片描述
    如下红色框框内时自己添加的代码内容:
    在这里插入图片描述
    代码解析:
    (1)

    public static final String EXTRA_MESSAGE="com.example.myapplication_002.MESSAGE";
    

    (2)

    public void sendMessage(View view){
    
        Intent intent = new Intent(MainActivity.this, DisplayActivity.class);
        EditText editText = (EditText) findViewById(R.id.editText01);
        String message = editText.getText().toString();
        intent.putExtra(EXTRA_MESSAGE, message);
        startActivity(intent);
        }
    

    sendMessage是作为按钮的onclick所触发的方法:

    这个时候,切换到activity_main.xml文件,选择button,onClick下就多了一个sendMessage选项,选择它即可。则按按钮时,会触发这个函数。
    在这里插入图片描述

    其中Intent是为了建立两个页面 MainActivity和DisplayActivity的联系,即进行页面切换
    在这里插入图片描述
    同时,获取得到输入的Text值,之后传递给另一个页面。得到输入的Text,并以字符串形式传递。

    intent.putExtra(EXTRA_MESSAGE, message)中,作用为传递参数;EXTRA_MESSAGE为键名,message为键对应的值。

    代码编写过程,可以会遇到一些标红的情况,这有很大可能是没有import对应的包,这个时候按住ALT+Enter键,会自动导入包。
    在这里插入图片描述

    (9)
    我们先在activity_display.xml中设置一个文本显示框;操作过程与Button类似,不作赘述。
    在这里插入图片描述然后切换到新建的DisplayActivity.java文件中:
    在这里插入图片描述
    intent.getStringExtra是为了获取上一个activity的输入字符串。
    而后获取显示文字的textview区域,并显示messge。

    (10)
    大体已经完成,由于我们要实现页面(即Activity)切换;我们需要设置两个Activity间的父类和子类的关系,保证打开APP进入默认的页面。
    找到该目录下的androidManifest.xml文件:
    在这里插入图片描述
    初始有两个Activity,但是没有红色框框中的内容,我们需要加上那两行,
    DisplayActivity为子Activity,而MainActivity为父Activity
    在这里插入图片描述
    (11)现在就完成了:选好红框框里面的内容,点击蓝框框。
    在这里插入图片描述
    这个过程会遇到奇奇怪怪的问题,即使第一个成功了,后面再次编译也可能有错,这个有可能是版本更新的问题。

    可以点击这个:
    在这里插入图片描述
    到红色框界面,查看有无需要更新的文件,更新即可。
    在这里插入图片描述
    结果出现了这个错误
    在这里插入图片描述
    其实是红色框自动切换了,我们只要把它切换回原来的Pixel……就可以。
    在这里插入图片描述
    (12)
    结果:

    运行得到:有一个是之前我写的application,不关注。点击开刚刚编写的app。
    在这里插入图片描述
    得到这个:
    在这里插入图片描述
    在文本框中输入文字,然后点击SEND按钮。

    在这里插入图片描述
    显示如下:
    在这里插入图片描述
    最后:这个网站对于Android studio是一个值得推荐的网站;还有纠错网站。

    展开全文
  • 一个页面 function GetQueryString(name) {  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");  var r = window.location.search.substr(1).match(reg);  if (r != null) return (r[2])...
  • test1.html页面 ... 第种方式,传输入的值 var tiaozhuan = function(){ document.location.href ='test2.html?mydata1=' + $("#txta").val(); } 第二种方式,传固定的值
  • 数据库的html内容显示到页面

    万次阅读 2015-01-06 10:56:30
    、js发送读取html内容请求 var url = "...", data = {id:".."}; $.ajax({ url: url, type : "post", data : data, dataType: "json", success: function(data, textStatus
  • http://demo.cssmoban.com/cssthemes3/ft5_30_fitness/index.html 就跟这种网站上面的效果一样。应该怎么实现!
  • ViewPager一屏显示多个子页面,常见的有两种形式:1、当前展示的页面右侧显示一部分下个页面内容2、当前页面居中,左右两边分别显示一个页面、下一个页面第。 ViewPager 一页显示多个实现代码 ViewPager 显示多...
  • 我在top.jsp页面一个按钮 ``` <li id="bk"><a href="javascript:history.go(-1)">返  回</span></a> ``` 然后left.jsp有一个标题的显示。我想点击top.jsp的返回按钮时,left.jsp的表现显示回他上级的...
  • 页面用于向数据库中添加前台用户输入的信息,然后重定向到一个查看信息的Servlet,该Servlet用于将信息交给一个JavaBean,最后用一个JSP显示信息,可是我在myeclipse中执行后什么也不显示,Access数据库里也没有内容...
  • 如题,我想用itext生成一份pdf,但是我想一个PdfPTable都完整地显示在 同一个页面上而不是分页。PdfPTable可以自动适应页面大小而让内容自动缩放吗?
  • 同一页面中二个iframe,如何实现点击其中一个iframe中的链接后,将链接内容显示到另一iframe二个iframe id分别为 iframe1和iframe2,实现点击iframe1中的链接,显示iframe2中iframe1 中包含一个 a.aspx, a.aspx中...
  • 需要一个input输入框,输入的内容自动存入localStorage并在刷新页面显示出来
  • 哪个控件可以实现像学生管理系统那样 左边点击一下,右边出现不同的内容
  • 如果展示一个列表,内容过长,样式就会错乱。如图: 更改后 : ...如何把长的内容截取指定的长度 ...因为文字太长,显示乱板,则:使用一个标签就可以了 在内容里面加一个样式 ,overflow:hidden;
  • c#写一个页面,打开页面默认查询一个语句,查询MYSQL数据库 然后按照查询的字段名称显示查询内容就可以了。 请求写一个例子就行,我自己更换查询语句和显示的字段名称 注意:我的目的就是在页面上按照...
  • 新建一个项目,向数据库中写入内容并将数据库表内容显示页面上。 主要参考资料:https://blog.csdn.net/lxfHaHaHa/article/details/76565756 参考教程中的代码及配置是Django1.x下的规则,将相关内容改成了符合...
  • 做项目遇到了页面之间传输数据的问题,特别是第一个页面的数据是使用ajax显示的,当点击ajax中append的li的时候,打开另一个页面,将第一个页面的数据显示在另一个页面上,具体情况如下: 一、这是第一个页面中的js...
  • 因为业务需求现在要打开一个页面。但是要求在新打开的页面不能显示地址栏,各位大神,这个怎么解?网上搜了很多都说用window.open的location属性,但是试着根本不管用。
  • HTML用两种方式实现将超链接内容显示到当前页面

    万次阅读 多人点赞 2018-08-24 10:41:35
    HTML用两种方式实现将超链接内容显示到当前页面 1. 直接使用超链接 在这里要用到iframe标签,将target指向iframe的name属性。 关键代码: &amp;amp;amp;amp;lt;a href=&amp;amp;amp;quot;task1....
  • 指定一个内容,网页中若有span标签含有该内容,则该span标签内的内容显示页面中 20 如图,一般情况下span里的“显示内容”会显示页面中。我想添加关键字“内容”,使得整句“显示内容”被屏蔽(即不...
  • 1、当页面列表某属性过长不能完整显示时,用title来显示(鼠标移动未完全显示的元素上,自动显示元素的完整值,如下面的反馈内容
  • 2、浏览器先查看浏览器缓存-系统缓存-路由器缓存,如果缓存中有,会直接在屏幕中显示页面内容。若没有,则跳第三步操作。 3、在发送http请求前,需要域名解析(DNS解析),解析获取相应的IP地址。 4、浏览器向...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,114,954
精华内容 445,981
关键字:

如何让内容显示到一个页面