Javascript Jquery.closest（）但是如何在单击elsewere时取消设置它？

哥们

这可能是一个基本的答案，但我正努力在任何地方找到答案

因此，我使用标签上的contenteditable来编辑和创建我拥有的页面上的内容，并且我已经通过浏览器删除了任何边框。因此，当选择编辑我的

标记以向用户显示正在使用的内容时，我使用jquery来更改

的背景

问题是我可以使用jquery将其设置为焦点，这没问题。但是，一旦我转到下一个可编辑标记，我就不知道如何在最后一个

上将背景设置回白色

这里是我用来设置的jquery，有什么想法吗

$( ".list-result-edit" ).focus(function() {
    $(this).closest(".detail-list li").css("background-color", "rgb(203, 255, 207)");
});

您需要更改单击的
li

这将解决我们的问题

$( ".list-result-edit" ).focus(function() {

    $(".detail-list li").css("background-color","-original_color-")
    $(this).closest(".detail-list li").css("background-color", "rgb(203, 255, 207)");
});


更好的解决方案是使用
class

CSS:

JS:

你能展示一个JSFIDLE的演示链接或整个HTML代码吗？如果不先看一下你的HTML标记卡，就帮不了你了，只在Chrome上测试了，因此这里使用了更好的解决方案，谢谢你的建议。当点击页面上的其他地方时，什么是去除绿色背景的最好方法？试试
$（document'）。点击（function（）{$（“.detail list li.edit”）.removeClass（'edit'）；}
不确定它是否能工作。能够使用$（“.list result edit”）.focusout（函数（）{$（“.detail list li.edit”）.removeClass（'edit'）；}）；
.edit{
    background-color : rgb(203, 255, 207);
}

$( ".list-result-edit" ).focus(function() {

    $(".detail-list li.edit").removeClass('edit');
    $(this).closest(".detail-list li").addClass('edit');
});