zoukankan      html  css  js  c++  java
  • Ajax,get

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Ajax</title>
    <script src="js/jquery-2.1.1.min.js"></script>
    <style>
    body{
    padding: 50px;
    font: 14px,helvetica;
    }
    ul{
    padding: 0;
    }
    ul li{
    list-style-type: none;
    background-color:gainsboro;
    margin-bottom: 10px;
    padding: 10px;
    }
    </style>
    </head>
    <body>
    <h1>jQuery Ajax</h1>
    <h2>Coffee Orders</h2>
    <ul id="orders">

    </ul>
    <h4>添加新的点餐列表</h4>
    <p>name:<input type="text" id="name"/></p>
    <p>drink:<input type="text" id="drink"/></p>
    <button id="app-order">Add</button>
    <script type="text/javascript">
    $(function(){
    var $orders = $('#orders');
    $.ajax({
    //请求类型
    type:'GET',
    //从哪里请求
    // url:'http:www.baidu.com/ajax/orders.json',
    //如果请求成功,返回
    success:function(data){
    // console.log(data);
    //进行遍历
    $.each(data, function(i,order) {
    // console.log(data);
    $orders.append('<li>Name:'+order.name+'Drink:'+order.drink+ "</li>");
    });
    }
    });
    })
    </script>
    </body>

    </html>

  • 相关阅读:
    docker基本指令
    Process API
    Go的Context用法
    golang的可空类型和零值
    动态编程(DynamicObject、ExpandoObject)
    git clean
    SQL Server Join
    公用表表达式 Common Table Expression
    ubuntu安装mysql
    asp.net core-使用Nlog和log4net
  • 原文地址:https://www.cnblogs.com/weixin2623670713/p/13054126.html
Copyright © 2011-2022 走看看