汇率插件学习/jQuery和Ajax

制作汇率插件

疫情期间，大家最好不要出门，安安全全在家办公和学习。
此次学习Ajax，制作了百度的汇率插件，百度查找汇率，就可以查看到原型。

制作好的功能及效果图

1. 点击转换汇率换算
2. 页面显示汇率运算结果
3. 点击交换select
4. 显示更新时间

• 页面中换算汇率和下拉框中的国家货币单位都是从后台接口返回的。
  

步骤

1. 查找汇率接口，找到一个
   https://api.exchangerate-api.com/v4/latest/USD
   并试验可以用。
   
2. 写静态画面。
   基本画面一开始做成这样，后面慢慢调整。
   
3. 使用Ajax调用接口，并在success中进行赋值与运算。
   例如：

   $.ajax({
   				type: 'post',
   				url: 'https://api.exchangerate-api.com/v4/latest/USD',
   				dataType: 'JSON',
   				contentType: 'application/x-www-form-urlencoded',
   				data: JSON.stringify(obj),
   				success: function(data) {
   					for(var key in data.rates) {
   						let input = $('#i').val();
   						$("#id_select2_demo1").append("<option value='" + key + "'>" + key + "</option>");
   						$(".val1").html(input);
   						$(".val2").html(input*data.rates[selectorx2.val()]);
   						let ti = getTime(data.time_last_updated);
   						$("#tim").html(ti)
   					}
   				}
   			})
   

4. 获取当前时间

// 获取当前时间
			function getTime() {
				var now = new Date();
				var year = now.getFullYear(); //得到年份
				var month = now.getMonth(); //得到月份
				var date = now.getDate(); //得到日期

				var hour = now.getHours(); //得到小时
				var minu = now.getMinutes(); //得到分钟
				var sec = now.getSeconds(); //得到秒

				month = month + 1;
				　　
				if(month < 10) month = "0" + month;
				if(date < 10) date = "0" + date;
				if(hour < 10) hour = "0" + hour;
				if(minu < 10) minu = "0" + minu;
				if(sec < 10) sec = "0" + sec;
				var currentTime = "";
				currentTime = year + "-" + month + "-" + date + " " + hour + ":" + minu + ":" + sec;
				$("#time").html(currentTime);
			}

学习过程中的插曲

昨天，也就是2020/2/3，本人查找汇率的时候，显示1美元=6.9364人民币。而今天回头再看，发现人民币竟然贬值了，1美元=7.0208人民币。忙不迭感叹啊，是不是因为我在家没点外卖。

目前的希冀

疫情面前，大家万众一心。目前痊愈人数已超出死亡人数，眼看疫情走向好转的趋势，望在最后紧要关头人们都配合政府，打赢这场疫情防护战！

源码

本人将此次制作的汇率插件源码上传到本人资源，方便有需要的自行下载查看。
传送门。
传送门2.0。