需求：

　　用户输入URL，使用iframe将目标URL的内容加载到页面指定位置（局部刷新）

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>使用iframe局部刷新</title>

</head>

<body>

<div>

    <p>请输入要加载的地址:<span id="currentTime"></span></p>

    <p>

        <input id="url" type="text">

        <input type="button" value="刷新" onclick="LoadPage();">

    </p>

</div>

<div>

    <h3>加载页面位置：</h3>

    <iframe id="iframePosition" style="width:100%;height: 500px;"></iframe>

</div>

<script>

    window.onload = function () {

        var myDate = new Date();

        document.getElementById('currentTime').innerText = myDate.getTime();

    };

    function LoadPage() {

        var targetUrl = document.getElementById('url').value;

        document.getElementById('iframePosition').src = targetUrl;

    }

</script>

</body>

</html>

Ajax-02 iframe实现伪“Ajax”的更多相关文章

  1. iframe实现伪ajax

    iframe实现伪ajax 数据提交的两种方式: Form Ajax Ajax提交数据的方法: JS实现 Jquery “伪”Ajax "伪"Ajax: iframe+from实现 ...

  2. 33)django-原生ajax,伪ajax

    一:概述 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用 一个简单操作 ...

  3. tornado之文件上传的几种形式form,伪ajax(iframe)

    1直接form提交给后台处理 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  4. 一个伪ajax图片上传代码的例子

    一个伪ajax图片上传实现代码. 复制代码代码如下: <?php  if($_FILES){  ?>  <script>  window.parent.ajaxUploadPi ...

  5. 伪ajax上传文件

    伪ajax上传文件   最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...

  6. 手动(原生ajax)和自动发送ajax请求 伪ajax(Ifrname)

    自动发送  ---> 依赖jQuery文件 实例-->GET请求: function AjaxSubmit() { $.ajax({ url:'/data', type:"GET ...

  7. 前端 - js方式Ajax/ jquery方式Ajax / 伪 ajax /伪ajax 进阶方式

    DJANGO环境搭建: 目录文件: 关闭CSRF 添加目录文件路径 配置url 视图配置: index页面配置: 测试:(成功) 进入正题: ajax 通过GET提交数据至后台: <!DOCTY ...

  8. 伪AJAX

    <h3>3,伪ajax</h3> <h6>学习iframe(嵌套别人家网站的)</h6> <div> <input id=" ...

  9. 框架----Django之Ajax全套实例（原生AJAX，jQuery Ajax，“伪”AJAX，JSONP，CORS）

    一.原生AJAX,jQuery Ajax,“伪”AJAX,JSONP 1. 浏览器访问 http://127.0.0.1:8000/index/ http://127.0.0.1:8000/fake_ ...

随机推荐

  1. Learning PHP Design Patterns

    Learning PHP Design Patterns CHAPTER 1 Algorithms handle speed of operations, and design patterns ha ...

  2. <2014 05 10> Android平台开发攻略

    1.标准SDK开发: IDE: Eclipse Netbeans Language: Java 2.标准NDK+SDK开发: IDE: Eclipse Language: Java(JNI) C/C+ ...

  3. flask大全

    django:重武器,内部包含了非常多组件:ORM.Form.ModelForm.缓存.Session,中间件,信号等... flask:短小精悍.内部没有太多组件,第三方组件非常丰富 1.初识fla ...

  4. [luogu4556]雨天的尾巴

    [luogu4556]雨天的尾巴 luogu 发现是一顿子修改然后再询问,那么把修改树上差分一下再线段树合并 但是... 如果你只有35分... https://www.luogu.org/discu ...

  5. mongo 一次插入多条

    db.getCollection('organization').insert( [ {"organizationTitle" : "台州广播电台1", &qu ...

  6. ssh远程执行远程执行命令

    ssh zxrac1 '/home/oracle/tmp/t5.sh 2 2 >/dev/null 2>&1 &'

  7. jQuery文档节点处理，克隆，each循环，动画效果，插件

    文档节点处理 //创建一个标签对象 $("<p>") //内部插入 $("").append(content|fn) ----->$(&quo ...

  8. Linux Shell编程第1章——Shell脚本编程概述

    目录 Linux和Shell简介 Linux是一套可免费使用和自由传播的类UNIX操作系统.Shell是一种具备特殊功能的程序,它提供了用户与内核进行交互操作的一种接口.它接收用户输入的命令,并把它送 ...

  9. 28. Implement strStr()(KMP字符串匹配算法)

    Implement strStr(). Return the index of the first occurrence of needle in haystack, or -1 if needle ...

  10. UVALive 6911 F - Double Swords

    思路:1.把所有有长度的剑看做点.Ai点是肯定要取.然后求另一把剑. 先对右区间排个序,然后每次看这个区间范围内有没有剑,如果没有就添加一把(值为右端点的剑): 如果有并且数量为1且这条龙的Ai等这把 ...