ここから本文です

jqueryのundefinedを表示させない方法 jquery未習の者です。

lon********さん

2017/3/315:58:32

jqueryのundefinedを表示させない方法

jquery未習の者です。

googleカレンダーのカスタマイズをしたくて、【fullCalendar.js】というものをダウンロードして様々なサイトを渡り歩いて下記のソースまで作成できたのですが、googleカレンダーの【説明】の部分が未記入だと【undefined】と表示されてしまい、どうしても解決方法がわかりませんでした。

jquery未習の者が手を付けるような事案ではないのかもしれませんが、どうしても解決したいです。
どこに何を差し込めばいいのかご存知の方がいらっしゃいましたら、ぜひご教授お願い致します。

ソース:
(function () {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();

$(document).ready(function() {

$('#calendar').fullCalendar({
editable: true,
height: 500,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,listYear'
},
titleFormat: 'YYYY年M月',
// ボタン文字列
buttonText: {
prev: '<',
next: '>',
today: '今日',
month: '月',
list: '一覧',
},
// 月名称
monthNames: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
// 月略称
monthNamesShort: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
// 曜日名称
dayNames: ['日曜日', '月曜日', '火曜日', '水曜日', '木曜日', '金曜日', '土曜日'],
// 曜日略称
dayNamesShort: ['日', '月', '火', '水', '木', '金', '土'],

googleCalendarApiKey: '●●●●●●●●●●●●●●●●●●●●●●●●●●',
eventSources: [
{
googleCalendarId:
'●●●●●●●●●●●●●●●●●●@group.calendar.google.com',
className: 'calendar_1'
},
{
googleCalendarId:
'●●●●●●●●●●●●●●●●●●@group.calendar.google.com',
className: 'calendar_2'
},
{
googleCalendarId:
'●●●●●●●●●●●●●●●●●●@group.calendar.google.com',
className: 'calendar_3'
},
{
googleCalendarId:
'●●●●●●●●●●●●●●●●●●@group.v.calendar.google.com',
className: 'calendar_4'
}

],

eventMouseover: function (data, event, view) {

tooltip = '<div class="tooltiptopicevent" style="width:auto;height:auto;background:#eeeeee;position:absolute;z-index:10001;padding:10px 10px 10px 10px ; line-height: 200%;">' + '予約状況: ' + ': ' + data.title + '</br>' + '詳細: ' + ': ' + data.description + '</div>';

$("body").append(tooltip);
$(this).mouseover(function (e) {
$(this).css('z-index', 10000);
$('.tooltiptopicevent').fadeIn('500');
$('.tooltiptopicevent').fadeTo('10', 1.9);
}).mousemove(function (e) {
$('.tooltiptopicevent').css('top', e.pageY + 10);
$('.tooltiptopicevent').css('left', e.pageX + 20);
});


},
eventMouseout: function (data, event, view) {
$(this).css('z-index', 8);

$('.tooltiptopicevent').remove();

},
dayClick: function () {
tooltip.hide()
},
eventResizeStart: function () {
tooltip.hide()
},
eventDragStart: function () {
tooltip.hide()
},
viewDisplay: function () {
tooltip.hide()
}


});

});

}());

補足どう表示させたいか未記入でした。

現在
【詳細:undefined】
となっているのを
【詳細:】
となることを望んでいます。
宜しくお願い致します。

閲覧数:
147
回答数:
2
お礼:
100枚

違反報告

ベストアンサーに選ばれた回答

app********さん

2017/3/317:09:45

data.description

[data.description,""][1*(data.description==undefined)]
に変えてください。
undefinedなら空、でなければ文字列が出ます。

  • 質問者

    lon********さん

    2017/3/317:23:29

    ありがとうございます!
    無事希望通りの表示になりました!
    本当にありがとうございました!

返信を取り消しますが
よろしいですか?

  • 取り消す
  • キャンセル

質問した人からのコメント

2017/3/3 17:26:34

ご回答いただいたお二人、ありがとうございました。

ベストアンサー以外の回答

1〜1件/1件中

god********さん

2017/3/316:09:40

htmlファイルの<script>タグでjsファイルを読み込んでいると思いますが、
FullCalendar.jsよりも前に、jQueryとMomentを読み込んでいますか?

---
<link rel='stylesheet' href='fullcalendar/fullcalendar.css' />
<script src='lib/jquery.min.js'></script>
<script src='lib/moment.min.js'></script>
<script src='fullcalendar/fullcalendar.js'></script>
---

のようにです。

返信を取り消しますが
よろしいですか?

  • 取り消す
  • キャンセル

この質問につけられたタグ

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる