需要在jquery-ui-datepicker中为每个日期创建一个带日期的自定义超链接

时间:2017-07-31 20:33:58

标签: jquery html datepicker jquery-ui-datepicker

我正在使用jquery datepicker,并且需要在日历链接中创建每一天的页面。

例如,如果您点击日期12月1日它将链接到http://myurl.com/12-01-17或2月2日它将链接到http://myurl.com/2-02-17

    jQuery( function() {
    jQuery("#datepicker").datepicker({
                    prevText: "<",
                    nextText: ">",
                    dayNamesMin: [ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ],
                    dateFormat: 'd MM yy',
                    showOtherMonths: true,
                    selectOtherMonths: true,
    });
});


<div id="datepicker"></div>

<a href="http://my-url.com/DATEPICKER DATE HERE"></a>

1 个答案:

答案 0 :(得分:0)

只需对datepicker使用onSelect选项。

$(function(){
  $( "#datepicker" ).datepicker({
    dateFormat: "dd-mm-yy",
    onSelect: function (date) {
      window.location="http://my-url.com/"+date.toString();
      //date.toString() is now in dd-mm-yyyy format, change it to meet your requirements
    }
  });

});
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<p>Date: <input id="datepicker" type="text"></p>
<a id="link" href="http://my-url.com/DATEPICKER DATE HERE">click me</a>