如果找到特定类，如何添加和删除属性

How to Add and remove attribute if found specific class

本文关键字：添加 属性 删除 何添加 如果      更新时间：2023-09-26

我有一些列表项，如果我单击任何列表项，它就会通过添加类.selected而被选中如果我在列表项外部单击，则所有列表项都将变为未选中状态。小提琴

我最初也禁用了一个按钮。我想通过在选择列表项时删除"禁用"属性来激活按钮。

同样，如果我单击所有列表项之外，则应取消选择所有列表项，并且按钮再次禁用。我该怎么做？任何帮助将不胜感激。

.JS 

$(".list-group-item").click(function() {
    $('.list-group-item').removeClass('selected');
    $(this).addClass('selected');
});
$(document).on('click', function (e) {
    if ($(e.target).closest(".list-group-item, .load-table").length === 0) {
      $('.list-group-item').removeClass('selected'); 
    }
});

您缺少的只是如何启用/禁用按钮，那就是

$('.load-table').prop('disabled',false); // or true to disable

因此，只需根据需要将其插入即可

$(".list-group-item").click(function() {
    $('.list-group-item').removeClass('selected');
    $(this).addClass('selected');
    $('.load-table').prop('disabled',false);
});
$(document).on('click', function (e) {
    if ($(e.target).closest(".list-group-item, .load-table").length === 0) {
      $('.list-group-item').removeClass('selected'); 
        $('.load-table').prop('disabled',true);
    }
});

http://jsfiddle.net/has9L9Lh/22/

改用.hasClass()并设置 else 条件，并禁用和启用按钮使用.prop() 

$(".list-group-item").click(function(e) {
    e.stopPropagation();
    $('.list-group-item').removeClass('selected');
    $(this).addClass('selected');
    $('.load-table').prop('disabled',false);
});
$(document).on('click', function (e) {
    if ($(e.target).hasClass("list-group")) {
      $('.list-group-item').removeClass('selected'); 
    }
    else{
        $('.list-group-item').removeClass('selected'); 
        $('.load-table').prop('disabled',true);
    }
});

演示

使用 jquery 的 attr（） 属性。

$(".list-group-item").click(function () {
    $('.list-group-item').removeClass('selected');
    $(this).addClass('selected');
    if ($("button").attr("disabled") === "disabled") {
        $("button").attr("disabled", false);
    }
});
$(document).on('click', function (e) {
    if ($(e.target).closest(".list-group-item, .load-table").length === 0) {
        $('.list-group-item').removeClass('selected');

        $("button").attr("disabled", true);
    }
});

上面的代码应该可以工作。单击该项目后，请检查按钮是否仍处于禁用状态。如果是，则启用该按钮。

当用户在列表外部单击时也是如此。

小提琴

相关文章：