Javascript 当模糊应用于div时,为什么单击不起作用

Javascript 当模糊应用于div时,为什么单击不起作用,javascript,jquery,html,Javascript,Jquery,Html,我有问题,点击它是不工作的模糊隐藏保存btn 下面的功能永远不会启动 $('.save-btn').on('click',function(){ alert('you clicked me !!'); }); 因为它将在单击模糊之前隐藏。我该怎么处理呢 问题:我想保留现有功能,.save btn应该可以工作 复制步骤: 双击项目保存按钮将出现 现在点击保存按钮,观察警报不会出现 这是我的密码: $function{ $'.save btn'.hide; $'.

我有问题,点击它是不工作的模糊隐藏保存btn

下面的功能永远不会启动

   $('.save-btn').on('click',function(){
         alert('you clicked me !!');
    });
因为它将在单击模糊之前隐藏。我该怎么处理呢

问题:我想保留现有功能,.save btn应该可以工作

复制步骤:

双击项目保存按钮将出现

现在点击保存按钮,观察警报不会出现

这是我的密码:

$function{ $'.save btn'.hide; $'.item wrapper'。在“dblclick”上,函数{ $'.item name'.removeAttr'contenteditable'; $this.find'.item name'.attr'contenteditable',true; $'.save btn'.hide; $this.find'.save btn'.show; }; $'.item name'。在“blur”上,函数{ $'.save btn'.hide; }; $'。保存btn'。单击,函数{ console.log“单击保存的按钮”; 警告“已单击保存的按钮!!”; }; }; 分隔容器{ 宽度:409px; } 迪沃{ 列表样式:无; 线高:48px; } 迪沃利{ 显示器:flex; 证明内容:之间的空间; } 项目包装器:悬停{ 背景:e2dada; } .保存btn{ 宽度:40px; 高度:40px; 背景:296b73; 文本对齐:居中; 边界半径:50%; 线高:38px; 颜色:eaeaed; 字体大小:13px; 边框:2个实心d8d8d8; 光标:指针; } 你好,世界,你好,班加罗缪错了1 拯救 你好,世界,你好,班加罗缪误会2 拯救 你好,世界,你好,班加鲁·缪误会3 拯救 你好,世界,你好,班加罗缪错4 拯救 你好,世界,你好,班加罗缪错5 拯救
也许这是你在firefox上测试过的浏览器&chrome运行良好
您现在是否使用MS internet explorer?它在IE中不工作,正如我所说,它在这里工作,请尝试重置您的浏览器或尝试其他浏览器


在您的代码中,您将在模糊上隐藏保存按钮,当您单击保存按钮时,模糊事件将首先触发,它将隐藏保存按钮,因此从技术上讲,在此之后,您不会单击保存按钮

要使这项工作,隐藏保存按钮后100左右,这样你将有机会点击保存按钮


或者不隐藏“模糊”上的“保存”按钮,请使用选项关闭

$function{ $.save-btn.hide; $.item-wrapper.ondblclick,函数{ $.item-name.removeAttrcontenteditable; $this.find.item-name.attrcontenteditable,true; $this.find.item-name.focus; $.save-btn.hide; $this.find.save-btn.show; }; $.item-name.onblur,functionevent{ //$.save-btn.hide; }; $.save-btn.onclick,函数{ 点击console.logsaved按钮; 已单击alertsaved按钮!!; $.save-btn.hide; }; }; 分隔容器{ 宽度:409px; } 迪沃{ 列表样式:无; 线高:48px; } 迪沃利{ 显示器:flex; 证明内容:之间的空间; } 项目包装器:悬停{ 背景:e2dada; } .保存btn{ 宽度:40px; 高度:40px; 背景:296b73; 文本对齐:居中; 边界半径:50%; 线高:38px; 颜色:eaeaed; 字体大小:13px; 边框:2个实心d8d8d8; 光标:指针; } 你好,世界,你好,班加罗缪错了1 拯救 X 你好,世界,你好,班加罗缪误会2 拯救 X 你好,世界,你好,班加鲁·缪误会3 拯救 X 你好,世界,你好,班加罗缪错4 拯救 X 你好,世界,你好,班加罗缪错5 拯救 X
可能不是最好的解决方案,但通过文档附加on blur事件将给出搜索结果

$(document).on("blur",".item-name",function(){
   $(".save-btn").hide();
 });
$function{ $.save-btn.hide; $.item-wrapper.ondblclick,函数{ $.item-name.removeAttrcontenteditable; $this.find.item-name.attrcontenteditable,true; $this.find.item-name.focus; $.save-btn.hide; $this.find.save-btn.show; }; $document.onblur、.item名称、函数{ $.save-btn.hide; }; $.save-btn.onclick,函数{ 点击console.logsaved按钮; 已单击alertsaved按钮!!; }; }; 分隔容器{ 宽度:409px; } 迪沃{ 列表样式:无; 线高:48px; } 迪沃利{ 显示器:flex; 证明内容:之间的空间; } 项目包装器:悬停{ 背景:e2dada; } .保存btn{ 宽度:40px; 高度:40px; 背景:296b73; 文本对齐:居中; 边界半径:50%; 线高:38px; 颜色:eaeaed; 字体大小:13px; 边框:2个实心d8d8d8; 光标:指针; } 你好,世界,你好,班加罗缪错了1 拯救 你好,世界,你好,班加罗缪误会2 拯救 你好,世界,你好,班加鲁·缪误会3 拯救 你好,世界,你好,班加罗缪错4 拯救 你好,世界,你好,班加罗缪错5 拯救
@苏海尔,警报从哪里来??单击“保存btn”时,它不工作。@Sohail,好的,我将更新我的code@Sohail,您双击然后编辑某些内容,在这种情况下,它会随机工作。请确认我。是的,它工作得很好。也许你已经禁用了警报,比如@Sohail saidOnce,它模糊了。浏览器很难看到它。在浏览器再次找到它之前,它基本上只是在黑暗中点击。这就是为什么它被称为模糊。这不是浏览器的问题,你观察过这个日志控制台吗;单击“保存”按钮。console.log“单击保存的按钮”;他不来了。这意味着它不工作。当我点击它输出保存的按钮点击控制台它的工作很好,我想你在js代码中有一个问题一些这是完整的脚本?因为我认为它的工作是孤立的,但在整页语法错误或其他情况下,不要在保存时隐藏save按钮,而是使用close按钮来关闭它。我已经更新了代码,请检查它的工作,这是非常随机的,我想为它永久的解决方案。请帮我找到永久解决方案。是的,它正在工作,但行为不好,您尝试为单个项目执行此操作,然后观察按钮将隐藏并显示。我非常愿意更改架构/布局,但只想双击显示保存按钮。当我离开时,它应该隐藏。没有,它工作得不完美,你尝试对同一个项目快速执行多次,观察有时保存按钮不会出现,有时出现并隐藏,有时隐藏/显示。或者,如果不在模糊上隐藏保存按钮,请使用一个选项关闭。你的意思是,单击保存按钮时,它不工作?