Question

在HTML部分显示，如果名为readOnly的布尔值为真，我希望隐藏一些类。

<div class="row">
        <div class="col-lg-12">                
            <div id="point-of-detection" style="display:none;">
                <h4>Point of Detection</h4>
                <div>
                    <ul class="list-inline">
                        <li><div class="btn btn-info" style="width:135px">Process</div></li>
                        <li>
                            <span class="btn btn-xs btn-info" onclick="addProcess($(this).parent().prev());">+</span>
                            <span class="btn btn-xs btn-danger" onclick="removeProcess($(this).parent().prev());">-</span>
                        </li>
                    </ul>
                    <ul class="list-inline">
                        <li><span class="btn btn-danger" style="width:135px">Work Elements</span></li>
                        <li>    

                            <span class="btn btn-xs btn-info" onclick="addWorkElement($(this).parent().prev());">+</span>
                            <span class="btn btn-xs btn-danger" onclick="removeWorkElement($(this).parent().prev());">-</span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

在我的JS中，我一直在尝试这段代码。

$(document).ready(function () {
console.log("ready!");
$('#drag-1').draggable();
var readOnly = true;
    //$("#readOnly").val();
var testId = $("#Id").val();
//hide all extra small buttons when true? "btn btn-xs btn-default" onclick="addBox($(&quot;#drag-1&quot;));">add</span>
console.log(readOnly + testId);
if (readOnly == true) {
    $('.btn btn-xs btn-default').hide();
    $('.btn btn-xs btn-info').hide();
}
});

所以当readOnly为true时我想隐藏所有这些元素

$('.btn btn-xs btn-default').hide();
    $('.btn btn-xs btn-info').hide();

是否存在某种问题，因为它是嵌套的？

Answer 1

您的选择器不正确。他们应该是：

$('.btn.btn-xs.btn-default').hide();
$('.btn.btn-xs.btn-info').hide();

每当你在选择器中放置一个空格时，就会开始讨论后代元素 - 在你的情况下，你的目标是在一个不存在的<btn-default>元素中包含一个不存在的<btn-xs>元素任何具有.btn类的元素。

在您的情况下，如果您只想定位额外的小按钮，那么您应该只使用该单个类：

$('.btn-xs').hide();

这适用于.btn-default和.btn-info按钮等。

jQuery Hide函数问题

1 个答案: