1.urls.py

url(r'^jiafa', views.jiafa),

2.views.py

def jiafa(request):

    if request.method == "GET":

        return render(request, "jiafa.html", locals())

    elif request.method == "POST":

        res = eval(json.dumps(request.POST))

        obj = {}

        obj["status"] = "true"

        obj["v1"] = res["v1"]

        obj["v2"] = res["v2"]

        obj["v3"] = int(res["v2"])*int(res["v1"])

        print(obj)

        return HttpResponse(json.dumps(obj))

3.jiafa.html

<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<form action="/jiafa" method="POST" id="fm">

    {% csrf_token %}

    <input type="text" name="v1"/>*

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

    <input type="text" name="v3" class="v3"/>

    {#    <input id="btn" type="button" value="Ajax提交" onclick="ajaxsubmit();"/><span id="sp"></span>#}

    <input id="btn" type="button" value="Ajax提交"/><span id="sp"></span>

</form>

<script src="/static/plugins/jquery.min.js"></script>

<script>

    $(function () {

        ajaxsubmit()

    });

    function ajaxsubmit() {

        $("#btn").click(function () {

            $.ajax({

                url: "/jiafa",

                data: $("#fm").serialize(),

                type: "POST",

                dataType: "json",

                success: function (args) {

                    if (args.status) {

                        var v = $(".v3").val(args.v3);

                        console.log(v.val());

                    }

                },

                error: function (arg) {

                    console.log(arg)

                }

            })

        });

    }

</script>

</body>

</html>

4.验证

Ajax 小实例的更多相关文章

  1. AJAX 小实例（转摘）

    最近老总提了一个小功能,在搜索网吧列表的时候加上网吧所属代理商这个条件,原有的搜索条件是一个地区二级联动,现在需要根据不同的地区显示不同的代理商集合.即在触发地区下拉框的onchange事件时,代理商 ...

  2. ajax常用实例代码总结新手向参考(一)

    http的交互方法有四种:get.post.put(增加数据).delete(删除数据) put和delete实现用的是get和post   get方式 页面不能被修改,只是获取查询信息.但是提交的数 ...

  3. JavaScript小实例：拖拽应用（二）

    经常在网站别人的网站的注册页中看到一个拖拽验证的效果,就是它的验证码刚开始不出来,而是有一个拖拽的条,你必须将这个拖拽条拖到底,验证码才出来,说了感觉跟没说一样,你还是不理解,好吧,我给个图你看看: ...

  4. winform 异步读取数据 小实例

    这几天对突然对委托事件,异步编程产生了兴趣,大量阅读前辈们的代码后自己总结了一下. 主要是实现 DataTable的导入导出,当然可以模拟从数据库读取大量数据,这可能需要一定的时间,然后 再把数据导入 ...

  5. CSS应用内容补充及小实例

    一.clear 清除浮动 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  6. Objective-C之代理设计模式小实例

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  7. Objective-C之@类别小实例

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  8. OC小实例关于init方法不小心的错误

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  9. canva实践小实例 —— 马赛克效果

    前面给大家带来了操作像素的API,此时此刻,我觉得应该配以小实例来进行进一步的说明和演示,以便给大家带来更宽广的视野和灵感,你们看了我的那么多的文章,应该是懂我的风格,废话不多说,进入正题: 这次给大 ...

随机推荐

  1. ASP.NET状态管理的总结

    阅读目录 开始 hidden-input QueryString Cookie ApplicationState ViewState,ControlState Session Profile 各种状态 ...

  2. 全网最详细的大数据集群环境下如何正确安装并配置多个不同版本的Cloudera Hue（图文详解）

    不多说,直接上干货! 为什么要写这么一篇博文呢? 是因为啊,对于Hue不同版本之间,其实,差异还是相对来说有点大的,具体,大家在使用的时候亲身体会就知道了,比如一些提示和界面. 全网最详细的大数据集群 ...

  3. 第六章-Javac符号表

    需要参考: (1)Architecture of a Java Compiler (2)关于符号Symbol第一篇 (3)关于符号Symbol第二篇 (4)关于类型Type (5)关于作用域范围Sco ...

  4. JavaScript -- FileSystemObject-文件夹

    -----057-FileSystemObject-文件夹.html----- <!DOCTYPE html> <html> <head> <meta htt ...

  5. Mybatis在非spring环境下配置文件中使用外部数据源（druidDatasource）

    Spring环境下, MyBatis可以通过其本身的增强mybatis-spring提供的org.mybatis.spring.SqlSessionFactoryBean来注入第三方DataSourc ...

  6. 面试：atoi和itoa的实现

    1.int atoi(const char* src) nullptr指针 空白字符' ','\t','\n' 符号位 避免值溢出 出错信息保存在全局变脸errnum中 ; int atoi(cons ...

  7. Java中mongodb使用and和or的复合查询

    在MongoDB的JAVA查询中对应这些问题 and查询 //条件 startsAt< curr and endsAt > curr long curr = new Date().getT ...

  8. 本地主机访问不了nginx 页面，请求超时

    虚拟机可以正常访问nginx页面,但是电脑浏览器访问不了,一番排差,防火墙的问题. /etc/init.d/iptables stop

  9. 设计模式之构建者(Builder)模式

    在五大设计原则的基础上经过GOF(四人组)的总结,得出了23种经典设计模式,其中分为三大类:创建型(5种).结构型(7种).行为型(11种).今天对创建型中的构建者(Builder)模式的思想进行了一 ...

  10. Linux常用基本命令[find]用法(1)

    find是个很强大的命令,用法很多. 作用:查找目录下的文件,同时也可以调用其他命令执行相应的操作 用法: find [选项] [路径][操作语句] find [-H] [-L] [-P] [-D d ...