gpt4 book ai didi

javascript - 添加 DISPLAY : NONE to span via jQuery when: mouse-click outside span, 或单击退出按钮等+

转载 作者:行者123 更新时间:2023-11-28 09:51:34 25 4
gpt4 key购买 nike

我想要的非常简单,但是每次我尝试添加我想要的功能时,我都会把事情搞砸,所以我决定寻求帮助并坚持使用我现在拥有的工作基本脚本。

我已经有一个正在进行中的脚本,我希望将其开发为几乎完全像这样工作: https://stackoverflow.com/a/7133084/1399030 { http://jsfiddle.net/Paulpro/YpeeR/25/ }(作者:PaulP.R.O.)

  • 打开隐藏范围
  • 隐藏隐藏范围
  • Span 有“CLOSE”按钮可退出 Span
  • 触发另一个 Span 时隐藏当前打开的 Span

想想...图片库预览功能...有点。

当在网页上点击 .popCovera.thumbnail 时,会触发“预览”跨度,此隐藏跨度将根据在其指定的唯一id上,通过 jQuery 将 display: block; 插入其 css。
这是一个包含多个项目的循环。

我已经到目前为止,这是我使用的工作脚本:

$(document).ready(function() {

$('.popCover').click(function(){
divID = $(this).attr('id');
$("#tooltip-"+divID).fadeIn('5000', function() {
$("#tooltip-"+divID).css("display", "block");
});
});

$("a.thumbnail").click(function() {
dvID = $(this).attr('id');
$("#tooltip-"+dvID).fadeIn('5000', function() {
$("#tooltip-"+dvID).css("display", "block");
});
});


});

但是现在,我需要向这些函数添加触发器,以使跨度再次消失,(通过将 display: none; 插入到其 css 中。

我希望 CURRENT SPAN 在以下情况下消失:
01.鼠标点击在span元素之外
02. 在范围内单击退出X按钮。 (就像在图像库上一样,当他们预览图像时,然后通过单击元素外部或预览中提供的退出按钮退出图像)
03. .popCovera.thumbnail 被重新单击(可能会触发显示不同 ID 的另一个范围。)

注释:
目前,我可以在页面上单击任意多个 anchor ,并且所有这些具有不同 ID 的跨度只会在页面上累积并相互堆叠。我真的不想那样。 我不希望一次打开超过 1 个跨度,因此我希望添加功能,使当前打开的跨度在进行另一次 anchor 单击时自行退出。

我确实尝试过自己做这件事,但是......我无法获得我尝试过的方法。由于我不是 jQuery 专家,因此将所有这些功能添加在一起太复杂了。我可以让其中一个工作,然后尝试在另一个工作中毁掉它。

此外,我正在考虑使用这种类似的方式退出跨度:

$(".the_span").fadeOut("5000").css("display", "none");

我不愿意只使用一些插件和对我来说不复杂的东西的唯一原因是,我已经非常喜欢我的“预览”跨度CSS,我已经准备好了。我只需要 jquery 部分即可工作:

触发时display: block一个跨度,如果满足上述条件则display: none它。

希望得到帮助,并且非常感谢每一位帮助!谢谢。

最佳答案

您必须尝试在打开/事件的元素上添加一个类,然后绑定(bind)所有事件以关闭它。必须对具有 .active 类的元素进行绑定(bind),例如,当关闭时,必须删除 .active 类。

关于javascript - 添加 DISPLAY : NONE to span via jQuery when: mouse-click outside span, 或单击退出按钮等+,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10862649/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com