栗子如图

最新推荐文章于 2021-01-25 13:12:33 发布

angle_hearts

最新推荐文章于 2021-01-25 13:12:33 发布

阅读量251

点赞数

本文链接：https://blog.csdn.net/angle_hearts/article/details/53997052

版权

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>天气接口</title>
</head>
<body>
<h2>app请求模拟器</h2>
请求地址：<input type="text" id="url" value="http://api.k780.com:88?app=weather.future"><br>
请求方式：<input type="radio" value="get" class="method" name="method"> get <input type="radio" value="post" class="method" name="method">post<br>
<span class="addsapn">
    参数名称：<input type="text" value="weaid" class="val_name"> 参数值：<input class="val_val" value="1" type="text"><br>
</span>
<div id='tbody'>
    <span  class="addsapn" id="span">
        参数名称：<input type="text" value="appkey" class="val_name"> 参数值：<input class="val_val" value="21388" type="text"><br>
    </span>
</div>
<input type="button" id="add" value="添加一个参数"><input type="button" id="sub" value="提交">
<div id="box" style="width:300px;height: 400px;background-color: lightblue;float: right;margin-top: -200px;margin-left: -500px; "></div>
</body>
<script src="./js/js.js"></script>
<script>
    $(function () {
        $('#add').click(function () {
            var str=" 参数名称：<input type='text' value='' class='val_name'> 参数值：<input class='val_val' value='' type='text'><br>";
            $('#tbody').append(str);
        });
        $('#sub').click(function () {
            var url=$('#url').val();
            var method=$('input:radio:checked').val();
            var len=$('.val_val').length;
            for(var i=0;i<len;i++){
                url+="&"+$('.val_name').eq(i).val()+'='+$('.val_val').eq(i).val();
            }
            alert(url);return;
//            b59bc3ef6191eb9f747dd4e83c99f2a4
            url+="&format=json&jsoncallback=data";

            $.ajax({
                url:url,
                type:method,
                dataType:'jsonp',
                jsonpCallback:'data',
                success:function(result){
                    var re=result.result;
                    var str='<table><th>citynm</th><th>days</th><th>weather</th>';
                    for(i in re){
                        str+='<tr>';
                        str+="<td>"+re[i].citynm+"</td>";
                        str+="<td>"+re[i].days+"</td>";
                        str+="<td>"+re[i].weather+"</td>";
                        str+='</tr>';
                    }
                    str+="</table>";
                    $('#box').html(str);;
                }
            });

        })


    })
</script>
<ml>

angle_hearts

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
栗子如图

html>html lang="en">head> meta charset="UTF-8"> title>天气接口title>head>body>h2>app请求模拟器h2>请求地址：input type="text" id="url" value="http://api.k780.com:88?app=weather.future">br>请求方式：input t
复制链接

扫一扫