转义选择器中的反斜杠

Question

我正在尝试将反斜杠转义为我的选择器之一：

if ( $("# b13d5ea8c7081ff2ed6e34ab9d05ced > div.small-box.bg-red").hasClass("bg-red") ) {
    //do something it does have the protected class!
    console.log("i have the protected class");
}

已经尝试过：

#// b13d5ea8c7081ff2ed6e34ab9d05ced > div.small-box.bg-red//

#// b13d5ea8c7081ff2ed6e34ab9d05ced > div.small-box.bg-red//

但这并不能解决问题。非常感谢您的专业知识。

干杯！ , 马克

补充信息：

我需要检查 "bg-red" class 是否存在于以下 div 之一中：

HTML

<div id="area4" class="col-sm-3 connectedSortable ui-sortable">

        <div id="8b13d5ea8c7081ff2ed6e34ab9d05ced" class="border-box">

                                    **<div class="small-box bg-red">**
                <div class="inner inner-box">
                    <p> </p>
                    <p>Veuillez svp saisir vos coordonnées<br><br></p>
                </div>
                <div class="icon">
                    <i class="ion ion-person"></i>
                </div>
                <a href="/admin/mes_coordonnees/details" class="small-box-footer">Saisir mes coordonnées <i class="fa fa-arrow-circle-right"></i></a>
            </div>
            <div class="action pull-right">
                <a href="javascript:void(0)" data-componentid="8b13d5ea8c7081ff2ed6e34ab9d05ced" data-name="Small Box" class="btn-edit-component"><i class="fa fa-pencil"></i></a>
                &nbsp;
                <a href="javascript:void(0)" data-componentid="8b13d5ea8c7081ff2ed6e34ab9d05ced" class="btn-delete-component"><i class="fa fa-trash"></i></a>
            </div>
                    </div>

</div>

Answer 1

转义反斜杠本身：

$("#\38 ...")

Answer 2

请检查一次或让我知道是否需要其他任何东西

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#button").on('click',function(){
var a = $("div#8b13d5ea8c7081ff2ed6e34ab9d05ced div.small-box")
console.log(a)
if(a.hasClass("bg-red")){
alert("hii")
}
})


});
</script>
</head>
<body>
<button id="button">Click to check class</button>
<div id="area4" class="col-sm-3 connectedSortable ui-sortable">

        <div id="8b13d5ea8c7081ff2ed6e34ab9d05ced" class="border-box">

                                    **<div class="small-box bg-red">**
                <div class="inner inner-box">
                    <p> </p>
                    <p>Veuillez svp saisir vos coordonnées<br><br></p>
                </div>
                <div class="icon">
                    <i class="ion ion-person"></i>
                </div>
                <a href="/admin/mes_coordonnees/details" class="small-box-footer">Saisir mes coordonnées <i class="fa fa-arrow-circle-right"></i></a>
            </div>
            <div class="action pull-right">
                <a href="javascript:void(0)" data-componentid="8b13d5ea8c7081ff2ed6e34ab9d05ced" data-name="Small Box" class="btn-edit-component"><i class="fa fa-pencil"></i></a>
                &nbsp;
                <a href="javascript:void(0)" data-componentid="8b13d5ea8c7081ff2ed6e34ab9d05ced" class="btn-delete-component"><i class="fa fa-trash"></i></a>
            </div>
                    </div>

</div>

</body>
</html>

Answer 3

2 个解决方案由

提供

我忘记在我的 blade 文件中导入 jquery，导入后，它起作用了。

@adesh-kumar

 $('div .small-box').hasClass('bg-red')

@Jack-bashford

 $('#\38 b13d5ea8c7081ff2ed6e34ab9d05ced').hasClass('bg-red');

感谢你们的时间和帮助。

特别感谢那个减去我的问题的人，这真的很有帮助，非常感谢...

转义选择器中的反斜杠

Escaping a backslash in selector

javascript

jquery

jquery-selectors