菊花链addClass和removeatt，Jquery

daisy chain addClass and removeatt, Jquery

本文关键字：Jquery removeatt addClass 菊花链      更新时间：2023-09-26

因此，我有以下查询，它确定JSON对象的值，并相应地设置Jquery面板css。

$('#pnlMissing').addClass((msg.d['MissingMessagesCount'] == "0") ? "panel-success" : "panel-danger");

我想试着聪明一点，同时禁用作为整个面板一部分的超链接。。

<div id="pnlMissing" class="panel">
  <div class="panel-heading">
    <h3 class="panel-title">Missing</h3>
    <span class="pull-right clickable" data-toggle="tooltip" data-original-stitle="Toggle Missing"><i class="glyphicon glyphicon-chevron-up"></i></span>
  </div>
  <div class="panel-body">
    <a id="lnkMissingMessages" href="#"><span id="missingCount"></span></a>
  </div>
</div>

如果条件逻辑是if/else，我知道如何禁用到超链接，但在我想使用的缩写符号中不知道，因为它非常干净。

所以，我的问题是，如果上面的addClass逻辑是真的，我如何也禁用超链接？

更新：IE似乎不尊重锚点的disabled属性（它只适用于HTML5浏览器）。

您将需要使用单击处理程序和e.preventdefault()禁用单击。这意味着您所需的链接将无法工作（如果没有的自定义jQuery扩展，则无法工作）。

自定义jQuery方法示例：

$.fn.disableLink = function(disable){
    // Turn off click and style
    this.off('click').css({'text-decoration': ''});
    if (disabled){
        // Enable click handler and style out underline
        this.on('click', function(e){
            e.preventDefault();
        }).css({'text-decoration': 'none'});
    }
}

与一起使用

 .find('a').disableLink(msg.d['MissingMessagesCount'] == "0");

JSFiddle:http://jsfiddle.net/TrueBlueAussie/x0jo1L1o/2/

下面的原始答案

可以使用布尔表达式有条件地设置禁用的属性。对于实属性（而不是纯属性），最好使用prop而不是attr。这还有一个额外的好处，您可以使用boolean值（这对属性值更有意义）：

   .find('a').prop('disabled', (msg.d['MissingMessagesCount'] == "0"));

所以在你的例子中，类似于：

   $('#pnlMissing').addClass((msg.d['MissingMessagesCount'] == "0") ? "panel-success" : "panel-danger").find('a').prop('disabled', (msg.d['MissingMessagesCount'] == "0"));

为了清晰/简洁，我总是这样计算一次表达式：

  var disabled = msg.d['MissingMessagesCount'] == "0";
  $('#pnlMissing').addClass(disabled ? "panel-success" : "panel-danger").find('a').prop('disabled', disabled);
相关文章：