Django框架中的Ajax操作 伪ajax操作(Iframe框架)

鳄鱼君

发表文章数:531

Vieu四代商业主题

高扩展、安全、稳定、响应式布局多功能模板。

¥69 现在购买
首页 » Python教程 » Django框架中的Ajax操作 伪ajax操作(Iframe框架)

jQuery其实就是一个JavaScript的类库,其将复杂的功能做了上层封装,使得开发者可以在其基础上写更少的代码实现更多的功能。

  • jQuery 不是生产者,而是大自然搬运工。
  • jQuery Ajax本质 XMLHttpRequest 或 ActiveXObject

你需要知道网页中的iframe标签,使用它就可以在你的网站其它的网页。我们对原生ajax中的代码来进行修改,之前你可以简单看一下iframe标签的用法:

<iframe src="https://www.e1yu.com"></iframe>

简单做个演示,通过输入框,将输入框的内容赋值到iframe的src属性上,通过iframe来送请求:

<input id="url"  type="text">
<input  type="button" value="发送iframe请求" onclick="iframeRequest();">
<iframe id="a1" src="https://www.e1yu.com"></iframe>
<script type="text/javascript" src="/static/jquery-3.4.1.js"></script>
<script>
    function iframeRequest() {
        var url=$('#url').val();  //点击之后获取id属性
        console.log(url);
        $('#a1').attr('src',url);

    }
</script>

现在我们使用form表单提交,form表单提交会刷新页面,现在我们想让form把数据转交给iframe来发送请求,并且使用jQuery拿到返回的数据,代码参考:

<form action="/json/" method="post" target="a1"> <!--让iframe跟form建立关系-->
    <iframe id="a1" name="a1" ></iframe>
    <input type="text" name="username">
    <input type="email" name="email">
    <input type="submit" onclick="submitForm();" value="form提交">
</form>
<script type="text/javascript" src="/static/jquery-3.4.1.js"></script>
<script>
    // .load() ,  .error() ,  .unload() ,已经不在支持,jquery1.8版本之后的都无法再使用;
    //使用  .on("load",function(){.................}) 来代替  .load()  即可;
    function submitForm() {
           $('#a1').on("load",function () {
                var text=$('#a1').contents().find('body').text();
                var obj=JSON.parse(text);
                console.log(obj);
           })
    }
</script>

未经允许不得转载:作者:鳄鱼君, 转载或复制请以 超链接形式 并注明出处 鳄鱼君
原文地址:《Django框架中的Ajax操作 伪ajax操作(Iframe框架)》 发布于2020-04-29

分享到:
赞(0) 赏杯咖啡

评论 抢沙发

6 + 9 =


文章对你有帮助可赏作者一杯咖啡

支付宝扫一扫打赏

微信扫一扫打赏

Vieu4.6主题
专业打造轻量级个人企业风格博客主题!专注于前端开发,全站响应式布局自适应模板。
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册