add/removeClass 用于阵列显示 - sonarqube

Question

我正在使用 sonarqube 分析我的代码并在以下函数中遇到错误：

$(function () {
     $("#SSNCollection input[type=text]").keydown(function (evt) {

         var IsNullEmptyText = "true";
         var ssntxtArrayText = [];
         var txtLength = 0;
         $("#SSNCollection input[type=text]").each(function () {
             var _tempValues = $(this).val().toString().replace(/[-]/g, '').trim();
             if (!isNaN(this.value.toString().replace(/[-]/g, '').trim())) {
                        var _temptxtlength = this.value.toString().replace(/[-]/g, '').trim().length;

                        ssntxtArrayText.push(_tempValues);
                    }
                });
                $.each(ssntxtArrayText, function (index, value) {
                    if (value.length >= 0) {
                        $('#resultValidation').css({
                            'display': 'none',
                        });
                        return false;
                    } else {
                        $("#resultValidation").removeAttr("style");
                    }

                });
            });
        });

问题始于 if (value.length >= 0) {。因为数组长度总是 >=0，所以 if 和后面的 else 是不必要的。因此我将语句更改为

$.each(ssntxtArrayText, function (index, value) {
       $('#resultValidation').css({
              'display': 'none',
       });
       return false;
});

我现在的问题是有人告诉我应该使用 addClass('hidden') 和 removeClass('hidden')，因为毕竟我可能需要 else 语句。但我不确定在这种情况下我将如何利用它们。有任何想法吗？谢谢！

Answer 1

hiddenclass 通常包含在 CSS 框架中，例如 Bootstrap。如果您没有使用 Bootstrap（或者您不确定），只需将以下 CSS 添加到您的项目 css 文件中。

.hidden { display:none!important; }

或内联html版本

<style>.hidden { display:none!important; }</style>

关于使用条件逻辑的注意事项 - 查看您的代码后，我可以确认 value 变量不是 return 数组。它实际上 return 一个字符串值，这意味着检查长度是否大于或等于 0 是合适的。如果要检查运行和 $.each 之前的数组长度，只需将 $.each 包装在 if(ssntxtArrayText.length > 0) 语句中即可。以下示例显示了使用 .addClass() & .removeClass() 并检查数组在 [=46= 之前是否有任何值的正确实现].

if(ssntxtArrayText.length > 0) {
    $.each(ssntxtArrayText, function (index, value) {
        if (value.length >= 0) {
            $('#resultValidation').addClass('hidden'); //hide
            return false;
        } else {
            $("#resultValidation").removeClass('hidden'); //unhide
        }
    });
}

注意：如果您要检查有效的社会安全号码，我建议确保该值的长度为 9 个字符。这将像这样完成：if (value.length == 9) {

add/removeClass 用于阵列显示 - sonarqube

add/removeClass for array display - sonarqube

javascript

css

jquery

sonarqube