h.js中ajax的应用

这几天一直在学习hcoder的仿有道的app制作，技术支持h5+mui+hjs。

      前面4节学起来基本没什么压力，基本就是搭一下框架，实现原生侧滑，调调hcoder官方提供的接口。动手跟着敲，理解以下就可以了。但是我昨天学到词典页面功能的时候，视频上老师调用的有道翻译api的接口，现在比较麻烦。之前就是随便申请一个接口就可以用，但毕竟这个视频已经出来了很久了。有道的官方也对他们的api做出了收费模式，但是还是可以有100元的体验卷。之前一直知道ajax但没实际用过，没办法跟着老师写，他用的hjs（hcoder基于jquery的重写，差不多，就写法不一样）。但我在有道上看的官方给的demo，别人的写法有点不一样。Ajax小白的我看了好几遍，还踩了好几次坑。其实他们那个demo本来有个地方就写错了。我在微博上艾特有道了，主要是懒得去找客服。哈哈。

     我就把两者结合起来写了，没想到成功了，已经困扰我一天了，终于解决了。

<script src="http://shared.ydstatic.com/js/jquery/jquery-3.1.1.min.js"></script>
<script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.js"></script>
<script src="js/mui.min.js"></script>
<script type="text/javascript" src="js/h.js" ></script>
<script type="text/javascript" charset="utf-8">

    mui.init();
    var _index, _self, _next, _prev;
    mui.ready();
    
    h('#submitBtn').tap(function(){
    var appSecret = 'W8IQcoaGE1aO5nmZLEqxP9MLmmt6CmHQ';
var appKey = '32ca0e4841e96bd3';//注意：暴露appSecret，有被盗用造成损失的风险
var salt = (new Date).getTime();
var query = h('#keywords').val();
if(query.length<1){mui.toast('请输入要翻译的文本'); return false;}
var from = 'zh-CHS';
var to = 'en';
var str1 = appKey + query + salt +appSecret;
var sign = md5(str1);
$.ajax({
    url: 'http://openapi.youdao.com/api',
    type: 'post',
    dataType: 'jsonp',//json不支持跨域请求，jsonp支持跨域请求
    data: {
        q: query,
        appKey: appKey,
        salt: salt,
        from: from,
        to: to,
        sign: sign
    },
    success: function (data) {
        console.log(JSON.stringify(data));
        h('#resShow').find('p').html(data.translation)
        h('#resShow').show();
    } 
});     
    });