Question

我正在我的网页上使用日历（jQuery日历），当它有事件时，我会在其上突出显示日期。当用户将鼠标悬停在突出显示的日期上时，我想显示弹出窗口（与工具提示相对）。现在使用这个，我能够使用以下内容显示工具提示，但我真正想要展示的是一个风格很好的弹出窗口，其中包含很多事件细节。

http://jquerybyexample.blogspot.com/2012/05/how-to-display-tooltip-on-jquery-ui.html

希望有人可以帮助我。

提前致谢

Answer 1

这可能会对你有所帮助，我想我不确定

鼠标悬停日历控件时弹出Jquery

<div id="popup"></div>

 ('li.calendar').hover(function(){
    //make an ajax call and populate the popup div with the data
    //easiest method is jquery.load(), but if you need more control use jquery.ajax();
    $("popup").load('path/to/page.asp',data,function(){
        $("popup").show();
   });

 });

jQuery('selector').hover(function(){ //or use mousemove
   getPopup(jQuery(this).text()); // just send any data to detect the date
 }) ;

 jQuery.get()//or jQuery.post()
 __doPostBack()//if you have update panels
 //or any ajax technique xmlhttprequest,PM,...

 function getPopup(date/*for example*/){
   jQuery.getScript('www.myWebsite.com/pageThatDrawsThePopup?date='+date);
  // getScript assuming that the return value is JS code the immediately draws the popup
   // ?date = date assuming that your page takes the date as query string and get the data from the database upon this field
  //dont forget to change the url
  //very simple very easy ...  

}

void myCalendar_DayRender(object sender, DayRenderEventArgs e)
{
    if (e.Day.Date.Day.ToString().EndsWith("7")){// Replace with your own condition
        e.Cell.CssClass+=   "specialCell"; //replace with your own custom css class name
    }
}

 $(document).ready(function(){

    $('.specialCell').hover(function(){

        function(){//This will get called when you mouseover
            alert('put your JQuery AJAX code here.');
        },

        function(){
            alert('do any clean-up (e.g. hiding the popup if you need to) here.');
         }
     });

将鼠标悬停在jQuery日历日期时弹出窗口

1 个答案: