Jquery 檢查類，如果類存在，請選中復選框

Question

我正在嘗試使用 Jquery 運行一個簡單的函數。 這是該函數的偽代碼-

“在頁面加載時，檢查類名“active”。如果存在這樣的類，請選中相應的復選框。否則繼續。 很直接。

我們定位的代碼的 HTML：

<li class="inactive" aria-selected="false">
        <input class="checkBox" type="checkbox" name="checkLink" value="Accessories">
            Accessories 1
    </li><!--box example won't be marked "checked" on page load-->



 <li class="active" aria-selected="false">
            <input class="checkBox" type="checkbox" name="checkLink" value="Accessories">
                Accessories 2
</li><!--box example will be marked "checked" on page load-->

我編寫的用於創建交互的 Jquery：

  $(document).ready(function(){
    alert("RUNNIN");

        if ("li").hasClass("active"){
             $('.checkBox').prop('checked', true);
        };

    alert("CODE RAN");
});

警報用於測試代碼中所有中斷的位置。 目前，在開始或結束時，它們甚至根本沒有加載。 但是，如果我完全刪除條件語句，它們確實會運行。

檢查谷歌開發工具，它在我的“if”行檢測到語法錯誤。 在此處添加屏幕截圖：點擊此處的鏈接查看屏幕截圖

猜猜我還不能嵌入圖像。 錯誤行在控制台“Unexpected token . on line 17”中說明了這一點，即 if("li").hasClass 行。

所以它並不期待。 但我不確定那里的語法有什么問題。 刪除它會導致它不期望 { 等等，直到整行被刪除。

我很難找到錯誤。 任何幫助將不勝感激。

Answer 1

您可以使用下面的命令檢查所有類active li元素，然后找到類checkBox復選框元素，然后檢查它。

$("li.active").find('.checkBox').prop('checked', true);

Answer 2

試試這個

 $(document).ready(function() { alert("RUNNIN"); $("li.active").find('.checkBox').prop('checked', true); alert("CODE RAN"); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <li class="inactive" aria-selected="false"> <input class="checkBox" type="checkbox" name="checkLink" value="Accessories"> Accessories 1</li> <!--box example won't be marked "checked" on page load--> <li class="active" aria-selected="false"> <input class="checkBox" type="checkbox" name="checkLink" value="Accessories"> Accessories 2 </li>

Answer 3

投票前運行代碼

$(document).ready(function(){
    alert("RUNNIN");

        if ($("li").hasClass("active")){
             $('.checkBox').prop('checked', true);
             //alert("asas");
        }

    alert("CODE RAN");
});

Answer 4

你也可以試試：

$(document).ready(function(){
    $(".active > input:checkbox").prop('checked', true);
});

Answer 5

完全同意@Martijn 但...

您忘記了 ( 和 a ) 和 $

// You have this:
if ("li").hasClass("active"){
// which should be
if( $("li").hasClass("active") ){
  ^ ^------------------------ ^

此外，您可以更輕松地做到這一點：

$('.checkBox').prop('checked', $("li").hasClass("active"));