隐藏内容和Jquery 2点击开火

Hidden Content and Jquery 2 Clicks to Fire

本文关键字：2点 开火 Jquery 隐藏      更新时间：2023-09-26

我知道有几个问题是相关的，但我想更清楚地问这个问题。我花时间在jsfiddle上复制了我的问题（底部的链接）。

我有一个jquery事件：

$(document).ready(function () {
    $('.ui.contact.selection.dropdown').on("click", function () {
         $(this).dropdown()
         ;
    })
});

下拉菜单位于模态内部，在点击该div之前，该模态实际上是不存在的，带有

    $('.item.contact').on("click", function () {
        $('.ui.modal')
          .modal('show')
          ;
    })

问题是，当我加载模态，然后单击下拉菜单时，该菜单需要单击两次才能启动。我猜这是因为下拉列表在页面加载时不可用。第一次点击加载，第二次点击触发？我不确定，但希望您能提供帮助！

请参阅jsfiddle

在创建下拉列表时尝试设置show选项：

$(this).dropdown('show', true)

Fiddle：http://jsfiddle.net/o8r0fzfg/8/

我尝试了下面的代码，它成功了！

$(document).ready(function () {    
    $('.ui.contact.selection.dropdown').dropdown();    
    //CONTACT MODAL
    $('.item.contact').on("click", function () {
        $('.ui.modal').modal('show');       
    });    
});

我认为"下拉菜单"应该在预加载时启动。

查看文档中的语义，第一个.下拉列表似乎会创建对象，第二个会触发切换（默认情况下）。如果你想让它成为一个切换操作，请尝试以下操作：

$(document).ready(function () {
    ...
    $('.ui.contact.selection.dropdown').dropdown();
    $('.ui.contact.selection.dropdown').on("click", function () {
        $(this).behavour("toggle");
    });
});

此事件不仅将处理打开，还将处理关闭。

JSFiddle

相关文章：