0

私はカレンダーを開発しています。ユーザーがカレンダー セルをクリックしたときに qTip2 ツールチップを開きたいと考えています。

Raynosの提案に従って、OOP の原則に従って jQuery コードを開発しようとしています。そこで、非常に基本的な例を試してみました。自分のコードをコンストラクターに入れ、それをセルの HTML で呼び出すだけです。

ここにHTMLコードがあります

<td onclick="new CalendarEvent('2012-10-22')" id="2012-10-22">

そしてJavascriptのもの

var CalendarEvent = function (date) 
{
    this.date = date;

    $('#'+this.date).qtip({
            content: 
            {
                text: 'Lorem ipsum',
                title: {
                    text: 'Lorem ipsum',
                    button: true
                }
            },
            position: {
                    my: 'left center', 
                    at: 'center'
            },
            show: {             
                    solo : true 
            },
            hide: 'click',
            style: {
                    tip: true,
                    classes: 'ui-tooltip-light'
            }
    });
}

たくさんの問題:

  • セルをクリックしても何も起こりませんが、カーソルをセルの外に移動してから再度セルにカーソルを合わせるとツールチップが表示されます。
  • 閉じるボタンが機能しません。
  • 2 番目のセルをクリックすると、最初のツールチップが閉じられ、新しいツールチップが開かれますが、最初のセルにカーソルを合わせると、古いツールチップが再び表示されます。

明らかに、手続き的な方法で同じコードを使用する場合、すべて問題ありません...

ありがとうございました

4

0 に答える 0