1

大多数日期选择器允许您从齿形日历中选择日期或手动输入日期。例如http://jqueryui.com/demos/datepicker/

这需要 - 两次点击（一次显示日历，一次选择正确日期） - 良好的视力（通常弹出的日历非常小） - 以及良好的手眼协调能力，以便在小日历中选择正确的日期你的鼠标。

对于高级用户来说这不是问题，但对于老年人和计算机初学者来说却是一个麻烦。

我找到了一个采用不同方法的网站。似乎他们的用户大多选择本周的日期。因此，他们将一周中的所有日子与工作日一起列出在一个酒吧中。当前日期以另一种颜色标记。右侧有一个小日历图标，可打开常规日期选择器。这使您可以访问所有常规日期选择器功能。这是一个截图： http: //mite.yo.lk/assets/img/tour/de/zeiten-erfassen.png

您知道任何具有类似功能的 jquery 插件吗？如果没有，您是否有任何其他插件或小部件可以帮助我加快开发速度？

谢谢！

4

2 回答 2

0

好的，我知道这是一个老问题，但它很有趣。答案不需要做那么多工作……看看吧！现在，我不会像那个屏幕截图那样坐下来设计它，但这也没什么大不了的，只需要更改 CSS。

CSS：

ul.sideways li{
    display:inline;
    border:1px solid #000;
    background-color:#DDD;
    padding:0 5px;
}​

HTML：

<ul class="sideways">
    <li>Sun,<span> </span></li>
    <li>Mon,<span> </span></li>
    <li>Tues,<span> </span></li>
    <li>Wed,<span> </span></li>
    <li>Thurs,<span> </span></li>
    <li>Fri,<span> </span></li>
    <li>Sat,<span> </span></li>
</ul>
<div id="displayDiv"></div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

jQuery：

var dayOfWeek=new Date().getDay();
var today=new Date().getDate();
var thisMonth=new Date().getMonth();
var monthArray=["Jan","Feb","Mar","Apr","May","Jun",
            "Jul","Aug","Sep","Oct","Nov","Dec"];
var weekStart=today-dayOfWeek;

$(".sideways>li").each(function(index){
    $(this).children("span").append(monthArray[thisMonth]+" "+(weekStart+index));
}).click(function(event){
  var selectedDay=new Date();
  selectedDay.setMonth(thisMonth);
  selectedDay.setDate(weekStart+$(this).index());
  //just to demonstrate:
  $("#displayDiv").empty().append("<p>"+selectedDay+"</p>");  
});
于 2010-05-21T07:35:51.337 回答
0

当然有办法，你来这里是希望我们为你做的吗？

下载流行的插件，看看他们的代码，改变一些东西。看看您是否可以将其更改为仅显示当前周。这将是一个令人沮丧但有益的过程。

这当然不是不可能的。

于 2009-07-25T17:56:07.823 回答