单击链接（扩展器）后仅执行一次警报

Posted 2023-02-24

【中文标题】单击链接（扩展器）后仅执行一次警报

【英文标题】：Execute alert only once after a link (expander) has been clicked

【发布时间】：2013-04-25 21:57:34

【问题描述】：

希望有人可以帮助我完成下一个挑战。以下脚本与我的 html 结合使用，当我单击展开的标题时，它会打开和关闭。我还调用了一个警报函数，它显示扩展标题的文本。这行得通。

我想做的是使警报只能显示一次，并且对已单击的展开器标题的任何后续单击都会停止显示警报。

这是我正在使用的 Jquery 代码...

  somesite.ca = 
        init: function() 
    $('.qa-set')
        .find('.answer')
            .addClass('hide')
            .end()
        .find('h3')
            .addClass('collapsed')
            .bind('click', this.click);
    $('#expand').bind('click', this.expandAll);
    $('#collapse').bind('click', this.collapseAll);
,

click: function()
    $(this)
        .toggleClass('collapsed')
        .parent()
            .find('.answer')
                .slideToggle('fast');
                // Once the expander has been clicked execute alert only once for that particular expander header
                alert($(this).text());

,

希望这是有道理的。非常感谢！

【参考方案1】：

将alert() 包装在一个 if 语句中，用于检查是否设置了变量。

var expander_clicked = false;

click: function()
$(this)
    .toggleClass('collapsed')
    .parent()
        .find('.answer')
            .slideToggle('fast');
    if (!expander_clicked)  // only alert if expander wasn't previously clicked
        alert($(this).text());
        expander_clicked = true;
    
,

【讨论】：

哇，谢谢！效果很好！一个小问题是，一旦单击其中一个扩展器，此代码将禁用所有扩展器的警报。这可能会清楚地解释我正在尝试做的事情（抱歉，如果缺乏适当的解释）：页面上有 5 个扩展器。用户单击展开器 1（触发警报）然后单击展开器 3（触发警报），用户单击展开器 4（触发警报），再次单击展开器 1（无警报），然后再次单击展开器 3（无警报）。所以警报是特定于扩展器的。希望这更清楚，我没有浪费你的时间。你写的很完美，太完美了:)

似乎如果我添加 this.expander_clicked 它似乎工作。 $(this) .toggleClass('collapsed') .parent() .find('.answer') .slideToggle('fast'); if (!this.expander_clicked) alert($(this).text()); this.expander_clicked = true; ，任何人都可以看到我的结构存在潜在问题吗？再次感谢！很棒的社区...