jQuery에서 특정 날짜 강조 표시 DatePicker 사용

날짜를 &으로 강조하고 싶습니다. 그 위에 마우스를 드래그하면 해당 날짜에 메시지를 추가하고 싶습니다. 코드는 다음과 같습니다 -jQuery에서 특정 날짜 강조 표시 DatePicker 사용

<head runat="server"> 
<title>HoliDayHighlight</title> 
<link href="StyleSheet1.css" rel="stylesheet" type="text/css" /> 
<script language= "jscript"> 
    $(document).ready(function() { 
    var SelectedDates = {}; 
    SelectedDates[new Date('07/10/2013')] = new Date('07/10/2013'); 
    SelectedDates[new Date('07/15/2013')] = new Date('07/15/2013'); 
    SelectedDates[new Date('07/20/2013')] = new Date('07/20/2013'); 

    $("#txtDate").datepicker({ 
     beforeShowDay: function(date) { 
      var Highlight = SelectedDates[date]; 
      if (Highlight) { 
       return [true, "Highlighted", Highlight]; 
      } 
      else { 
       return [true, '', '']; 
      } 
     } 
    }); 
}); 

</script> 
</head> 

<body> 
<form id="form1" runat="server"> 
<div style="height: 220px"> 
<div style="height: 191px; width: 1156px"> 
<asp:TextBox ID="txtDate" runat="server"></asp:TextBox> 
</div> 
</div> 
</form> 
</body>

내가 날짜에 메시지를 표시해야합니다. 예 : - 우리는 7 월 15 일이 공휴일이라고 선언했습니다. 캘린더에서 15 일에 마우스를 가져 가면 마우스를 제거하면 작은 메시지가 표시됩니다 (예 : 오늘은 휴일입니다).

이 코드는 라이트라고 생각합니다. 하지만, 텍스트 상자를 클릭하면 캘린더가 나타나지 않습니다.

출처

2013-07-13 Sabyasachi

체크 아웃은 다음 코드는 내가 그냥 :)

코딩 :

<html> 
    <head> 
    <title> Datepicker Swappy</title> 
    <script type='text/javascript'  src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script> 
    <link rel="stylesheet" type="text/css" href="/css/normalize.css" 
    <script type="text/javascript" src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 
    <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.all.css"> 
    <style type='text/css'> 
    body 
    { 
    font-family:Arial; 
    font-size : 10pt; 
    padding:5px; 
    } 

    .Highlighted a 
    { 
    background-color : Orange !important; 
    background-image :none !important; 
    color: White !important; 
    font-weight:bold !important; 
    font-size: 12pt; 
    } 

    </style> 
    <script type='text/javascript'> 
$(window).load(function(){ 
    $(document).ready(function() { 
    var SelectedDates = {}; 
    SelectedDates[new Date('04/05/2014')] = new Date('04/05/2014'); 
    SelectedDates[new Date('05/04/2014')] = new Date('05/04/2014'); 
    SelectedDates[new Date('06/06/2014')] = new Date('06/06/2014'); 

    var SeletedText = {}; 
    SeletedText[new Date('04/05/2014')] = 'Holiday 1'; 
    SeletedText[new Date('05/04/2014')] = 'Holiday 2'; 
    SeletedText[new Date('06/06/2014')] = 'Holiday 3';  

    $('#txtDate').datepicker({ 
    beforeShowDay: function(date) { 
     var Highlight = SelectedDates[date]; 
     var HighlighText = SeletedText[date]; 
     if (Highlight) { 
      return [true, "Highlighted", HighlighText]; 
     } 
     else { 
      return [true, '', '']; 
     } 
     } 
    }); 
    }); 
    }); 
</script> 
    </head> 
    <body> 
    <input type='text' id='txtDate' /> 
</body> 
</html>

해피 일하고 테스트

출처

2014-03-25 11:28:34 Swapy

jQuery에서 특정 날짜 강조 표시 DatePicker 사용

답변

관련 문제