2016-07-28 89 views
0

我有一個日曆啓動和運行,如果有比3更多的事件,我每天有一個更多的..按鈕。點擊此按鈕後會出現一個下拉菜單並顯示其他事件在那一天。jQuery有多個點擊事件

它獲取每個下拉列表的正確數據,但如果我點擊觸發點擊按鈕,他們都打開。

的Jquery:

<script> 
function deselect(e) { 
$('.pop').slideFadeToggle(function() { 
    e.removeClass('selected'); 
}); 
} 

$(function() { 
    $('[id^=contact]').on('click', function() { 
    if($(this).hasClass('selected')) { 
    deselect($(this)); 
     } else { 
    $(this).addClass('selected'); 
    $('.pop').slideFadeToggle(); 
    } 
    return false; 
    }); 

    $('.close').on('click', function() { 
    deselect($('#contact')); 
    return false; 
    }); 
}); 

$.fn.slideFadeToggle = function(easing, callback) { 
    return this.animate({ opacity: 'toggle', height: 'toggle' }, 'fast', easing,  callback); 


}; 
</script> 

HTML + Django的

{% if forloop.counter|divisibleby:2 %} 
    <a href="/contact" id="contact{{  forloop.counter }}" class="popup"><small>More...<small></a> 
    <div class="messagepop pop"> 
{% endif %} 

<p class="alert" style="background- color: #{{ occurrence.event.category.color }}"> 
    <a title="{{ occurrence }}" href="{% url "calendar_occurrence_detail" pk=occurrence.event.pk year=occurrence.start.year month=occurrence.start.month day=occurrence.start.day %}">{{ occurrence|truncatechars:22 }}</a> 
</p> 
{%if forloop.last%} 
    </div> 
{% endif %} 

我不是最好的JQuery的所以這可能是簡單的爲他人,但我似乎無法弄清楚

提前致謝! JF

編輯 - 懸停DIV +數據以創建for循環

回答

1

你可以使用.next()選擇方法單擊處理程序上的當前點擊按鈕
$(this))。

只要改變

$('.pop').slideFadeToggle(); 

$(this).next().slideFadeToggle(); 
+0

心中已經已經試過,試過也是你們的,但它不能正常工作,單擊它幾次你可能會打包後得到它打開,但當你這樣做可能是任何數量的彈出框,謝謝 –

+0

你可以編輯你的問題,張貼一部分呈現的HTML而不是Django模板。想要在小提琴中測試這個,這不應該很難弄清楚。 – DavidDomain

+0

https://jsfiddle.net/0naysjd3/在這裏,我不能讓它正常工作。生病繼續努力,但其所有在那裏.. 所以在第28/29日的前3個事件後,你看到其他事件後更多的這些應該在下拉鍊接不知道爲什麼它現在不工作 –