Mulder's Java小鋪: [jQuery] $.map 使用方式

需求：傳入日期，取出對應的匯率值

	function DateRate(selectDate){
	var ratelist = [{ date: "2018/01/18", rate: "30.11" },{ date: "2018/01/19", rate: "30.12" }];

	//print object array
	console.log(ratelist);

	var def = $.map(ratelist, function (item, index) {
	if (item.date == selectDate) {
	return item.rate;
	}else {
	return null;
	}
	});

	//print def array
	console.log(def)

	if(def !== ''){
	//print 30.11
	$("#ratetxt").val(def[0]);
	}else {
	$("#ratetxt").val("no data");
	}

	}

view raw Jquery $.map 使用方式 hosted with ❤ by GitHub

完整範例應用

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
	<link href="https://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
	<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

	<title>依選擇日期取得對應匯率</title>
	</head>
	<body>
	<h2>依選擇日期取得對應匯率</h2>

	選擇日期：
	<input id="ExchangeRateDate" type="text" />
	<br/><br/>
	顯示匯率：
	<input id="ratetxt" type="text" readonly="readonly"></div>

	<script id="jsbin-javascript">
	function DateRate(selectDate){
	var ratelist = [{ date:"2018/01/18", rate:"30.11" },
	{ date:"2018/01/19", rate:"30.12" },
	{ date:"2018/01/20", rate:"30.13" }];

	//print object array
	console.log(ratelist);

	var def = $.map(ratelist, function (item, index) {
	if (item.date == selectDate) {
	return item.rate;
	}else {
	return null;
	}
	});

	//print def array
	console.log(def);

	if(def !== ''){
	//print 30.11
	$("#ratetxt").val(def[0]);
	}else {
	$("#ratetxt").val("no data");
	}

	}


	$.datepicker.setDefaults($.datepicker.regional["zh-TW"]);

	$("#ExchangeRateDate").datepicker({
	changeYear: true,
	changeMonth: true,
	dateFormat: "yy/mm/dd",
	maxDate: 0,
	//minDate: "-1m",
	onSelect: function (dat, inst) {
	DateRate(dat);
	}
	});
	</script>



	<script id="jsbin-source-javascript" type="text/javascript">

	function DateRate(selectDate){
	var ratelist = [{ date:"2018/01/18", rate:"30.11" },
	{ date:"2018/01/19", rate:"30.12" },
	{ date:"2018/01/20", rate:"30.13" }];

	//print object array
	console.log(ratelist);

	var def = $.map(ratelist, function (item, index) {
	if (item.date == selectDate) {
	return item.rate;
	}else {
	return null;
	}
	});

	//print def array
	console.log(def);

	if(def !== ''){
	//print 30.11
	$("#ratetxt").val(def[0]);
	}else {
	$("#ratetxt").val("no data");
	}

	}


	$.datepicker.setDefaults($.datepicker.regional["zh-TW"]);

	$("#ExchangeRateDate").datepicker({
	changeYear: true,
	changeMonth: true,
	dateFormat: "yy/mm/dd",
	maxDate: 0,
	//minDate: "-1m",
	onSelect: function (dat, inst) {
	DateRate(dat);
	}
	});

	</script></body>
	</html>

view raw 依選擇日期取得對應匯率 html hosted with ❤ by GitHub

	function DateRate(selectDate){
	var ratelist = [{ date:"2018/01/18", rate:"30.11" },
	{ date:"2018/01/19", rate:"30.12" },
	{ date:"2018/01/20", rate:"30.13" }];

	//print object array
	console.log(ratelist);

	var def = $.map(ratelist, function (item, index) {
	if (item.date == selectDate) {
	return item.rate;
	}else {
	return null;
	}
	});

	//print def array
	console.log(def);

	if(def !== ''){
	//print 30.11
	$("#ratetxt").val(def[0]);
	}else {
	$("#ratetxt").val("no data");
	}

	}


	$.datepicker.setDefaults($.datepicker.regional["zh-TW"]);

	$("#ExchangeRateDate").datepicker({
	changeYear: true,
	changeMonth: true,
	dateFormat: "yy/mm/dd",
	maxDate: 0,
	//minDate: "-1m",
	onSelect: function (dat, inst) {
	DateRate(dat);
	}
	});

view raw 依選擇日期取得對應匯率 jquery hosted with ❤ by GitHub

Mulder's Java小鋪

2018年1月22日星期一

[jQuery] $.map 使用方式

沒有留言:

2018年1月22日 星期一

[jQuery] $.map 使用方式

沒有留言:

2018年1月22日星期一