2 shenlei shenlei 于 2014.12.14 09:52 提问

关于Javascrit日历上显示价格取值的问题

我想在这个Demo:
http://www.crazyjs.org/demo/calendar/

在这个showFu':function回调函数里,根据传进来的日期,进行比对,获取该日期的价格,比如传进来的是2014-12-9日,那么就到json数据里来找这个价格信息,
我尝试写了一些getprice的方法,执行效率都太低了,,有哪位大侠帮帮忙,帮我根据这个Json写个getprice的方法,展现到日历上
附json数据
[ { "adate":"2014/12/3","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"1","lineid":"843","beforeDay":"5","week":"星期三"}, { "adate":"2014/12/4","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"2","lineid":"843","beforeDay":"5","week":"星期四"}, { "adate":"2014/12/5","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"3","lineid":"843","beforeDay":"5","week":"星期五"}, { "adate":"2014/12/6","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"4","lineid":"843","beforeDay":"5","week":"星期六"}, { "adate":"2014/12/7","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"7","lineid":"843","beforeDay":"5","week":"星期日"}, { "adate":"2014/12/7","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"5","lineid":"843","beforeDay":"5","week":"星期日"}, { "adate":"2014/12/11","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"8","lineid":"843","beforeDay":"5","week":"星期四"}, { "adate":"2014/12/19","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"6","lineid":"843","beforeDay":"5","week":"星期五"}]

5个回答

xuzuning
xuzuning   Ds   Rxr 2014.12.14 14:06
已采纳
 <script>
data = [
{ "adate":"2014/12/3","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"1","lineid":"843","beforeDay":"5","week":"星期三"},
{ "adate":"2014/12/4","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"2","lineid":"843","beforeDay":"5","week":"星期四"},
{ "adate":"2014/12/5","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"3","lineid":"843","beforeDay":"5","week":"星期五"},
{ "adate":"2014/12/6","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"4","lineid":"843","beforeDay":"5","week":"星期六"},
{ "adate":"2014/12/7","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"7","lineid":"843","beforeDay":"5","week":"星期日"},
{ "adate":"2014/12/7","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"5","lineid":"843","beforeDay":"5","week":"星期日"},
{ "adate":"2014/12/11","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"8","lineid":"843","beforeDay":"5","week":"星期四"},
{ "adate":"2014/12/19","ss":"0","price":"1850","eprice":"1750","childpirce":"1950","id":"6","lineid":"843","beforeDay":"5","week":"星期五"}
];

function getprice(t) {
  t = t.replace(/-/g, '/');
  for(var i=0; i<data.length; i++) {
    if(data[i].adate == t) return data[i];
  }
}
alert(getprice('2014-12-19').price);
</script>

showbo
showbo   Ds   Rxr 2014.12.14 17:41

showFu的参数d先转为字符串,然后再遍历json数组。

 funtion getPrice(arr,adate){
  if(typeof adate=='object')adate=adate.getFullYear()+'/'+(d.getMonth()+1)+'/'+ d.getDate();//日期对象
  else adate=adate.replace(/-/g,'/');//字符串
  for(var i=0,j=arr.length;i<j;i++)
    if(arr[i].adate==adate)return '<br/><b style=\"color:red\">¥158<\/b>';
  return '';
}

  'showFu':function(d){return getPrice(你的那个json数组变量名称,d)}
shenlei
shenlei   2014.12.18 00:10

感谢二位的回答,我已经解决了,修改了json的文件结构

shenlei
shenlei   2014.12.18 00:12

将日期转化为了对象,直接用。根据日期.adate,取日期.price,遍历还是慢

qq_28584559
qq_28584559 您好,我按照上面两位的方法,遍历数组,但是却无法将价格显示在日历上,能告诉我,你是用什么方法能显示出价格的吗?
6 个月之前 回复
zylovegxs
zylovegxs   2014.12.23 15:07

我说说我的思路 正巧我现在写的项目里也有这么一个日历显示价格的东西。第一步:先生成一个空的日历【里面不带JSON】。第二步再把JSON取出来在日历中做比较 有符合的就把那一天的日历显示的【

】之类的替换下内容。
下面是代码 给你参考一下。
                                            这个table是当前日期的
                                            下面是JS
                                            /*
定义月份

/
function montharr(m0, m1, m2, m3, m4, m5, m6, m7, m8, m9, m10, m11) {
this[0] = m0;
this[1] = m1;
this[2] = m2;
this[3] = m3;
this[4] = m4;
this[5] = m5;
this[6] = m6;
this[7] = m7;
this[8] = m8;
this[9] = m9;
this[10] = m10;
this[11] = m11;
}
/

生成日历
*/
function calendar(dates) {
var x = dates == "" ? '2014,12,01' : dates;
x = fixDate(x);
var today = new Date(x); //当前日期

var monthDays = new montharr(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);       //月份  
var year = '';
var thisDay = '';
year = today.getFullYear();                                                       //年
thisDay = today.getDate();                                                          //当前天

if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) monthDays[1] = 29; //闰年判断

$('#ttii').html(today.getFullYear() + '年' + (today.getMonth() + 1) + '月');


$('#before').attr("href", "javascript:calendar('" + subDate(x, monthDays[(today.getMonth() - 1) < 0 ? 0 : today.getMonth() - 1]) + "')");                                     //上一个月
$('#after').attr("href", "javascript:calendar('" + addDate(x, monthDays[(today.getMonth() + 1) == 12 ? 0 : today.getMonth() + 1]) + "')");   //下一个月  

nDays = monthDays[today.getMonth()];
firstDay = today;
firstDay.setDate(1); // works fine for most systems
testMe = firstDay.getDate();
if (testMe == 2) firstDay.setDate(0);
startDay = firstDay.getDay();

$('#calendar').html('');
var tr1 = '<tr>';
var td = '';
var tr2 = '</tr>';
column = 0;
td += tr1;
for (i = 0; i < startDay; i++) {
    td += "<td class='tdconter'>&nbsp;</td>";
    column++;
}

for (i = 1; i <= nDays; i++) {
    if (i == thisDay) {
        td += '<td day=' + i + ' class="tdconter"><font style=font-size:9pt;color:red><b>' + i + '</b></font></td>';
    }
    else {
        td += '<td day=' + i + ' class="tdconter">' + i + '</td>';
    }
    column++;
    if (column == 7) {
        td += tr2 + tr1;
        column = 0;
    }
}
for (i = 1; i <= 7 - column; i++) {
    td += "<td class='tdconter'>&nbsp;</td>";
}
td += tr2;

$('#calendar').append(td);

}

/*
增加日期
*/
function addDate(date, days) {
var d = new Date(date);
var month = d.getMonth() + 1; //获取当前月份
var year = d.getFullYear(); //获取当前年份

var gety, getm;

if (month == 12) {
    getm = "01";
    gety = year + 1;
}
else {
    if (month < 9) {
        getm = "0" + (month + 1)
    }
    else {
        getm = month + 1;
    }
    gety = year;
}

var val = gety + "-" + getm + "-" + "01";
return val;

}

/*
减少日期
*/
function subDate(date, days) {
var d = new Date(date);
var month = d.getMonth() + 1; //获取当前月份
var year = d.getFullYear(); //获取当前年份

var gety, getm;

if (month == 1) {
    getm = "12";
    gety = year - 1;
}
else {
    if (month > 10) {
        getm = month - 1
    }
    else {
        getm = "0" + (month - 1);
    }
    gety = year;
}

var val = gety + "-" + getm + "-" + "01";
return val;

}

/*修正在IE678下无法正常计算日期的问题*/
function fixDate(time) {
if (!document.all) {
return new Date(time);
}
var arr = time.split(time.match(/\D+/g)[0]);
return new Date(arr[0], arr[1] - 1, arr[2]);
}

/*
获取日历线路
*/
function getCalendar(tourid, bdate, edate) {
var postData = {
tourId: tourid,
bdate: bdate,
edate: edate,
name: $('#name').val()
};
$.ajax({
type: "GET",
url: "/api/Path",
data: postData,
dataType: 'json',
cache: false,
success: function (data) {
if (data != null) {
$('#calendar td').each(function () {
for (var j = 0; j < data.length; j++) {
if ($(this).attr("day") == data[j].LeaveDate.substring(0, 10).substring(8)) {
var old = '';
old = $(this).html();
$(this).html('');
var now = '';
now += data[j].IsStop == false ? '

' : '
';
now += '
' + old + '
';
now += data[j].IsStop == true ? '
停收
' : '
余票' + data[j].SurplusPeople + '
';
now += '
' + data[j].AdultPrice + '元
';
now += '
';
$(this).html(now);
now = '';
if ((data[j].TourId == $('#tourid').val() && data[j].IsStop == true) || (data[j].TourId == $('#tourid').val() && data[j].SurplusPeople == 0)) {
$('#order0').hide();
$('#order1').hide();
}
break;
}
}
});
}
}
});
}

/*初始化调用*/
$(function () {
calendar("");
});

希望对你有所帮助吧。至于效率 我感觉不出来有多慢。

Csdn user default icon
上传中...
上传图片
插入图片