在頁面加載時基於複選框值的jQuery顯示

我有一個ASP MVC Web應用程序，在其中一個頁面上有一組主複選框，其下有子複選框。只有當相應的主複選框被選中時，子複選框纔會顯示。只要沒有任何複選框在頁面加載時被選中，我就可以使用以下代碼。在頁面加載時基於複選框值的jQuery顯示

$("input[id$=Suffix]").change(function() { 

     prefix = this.id; 

     if (!$(this).hasClass("checked")) { 
      $("tr[id^=" + prefix + "]").show(); 
      $(this).addClass("checked"); 
     } 
     else { 
      $("tr[id^=" + prefix + "]").hide(); 
      $(this).removeClass("checked"); 
     } 
    });

現在我需要檢查數據庫的主複選框的值。我得到的值，並可以檢查頁面加載框。但是當頁面出現時，當複選框被選中時，子複選框不會顯示。此外，如果在加載頁面時選中主複選框，則只有在取消選中主chcekbox時顯示子複選框（顯然是因爲上述函數僅對.change（））起作用。

你們都建議我試試？如果您需要進一步解釋，請隨時詢問。

編輯：順便說一句，這一切都是在$（文件）。就緒（）

來源

2010-05-21 Jacob Huggart

如何從數據庫中獲取檢查值並設置主複選框？ AJAX調用和dom？還是asp腳本？ – edl 2010-05-21 20:16:13

我只是使用Model（LINQ to SQL）來檢查數據庫，然後從我的控制器中設置ViewData。 – 2010-05-21 20:18:56

由於您有關於「父」複選框是否已選中或未在服務器端（呈現時）的信息，爲何不將「子複選框」呈現爲正確的（可見或隱藏）狀態，而不是嘗試觸發他們的客戶端？ – R0MANARMY 2010-05-21 22:57:03

你的功能纔會被調用的變化，所以它不是一開始射擊。您需要在頁面加載時運行以檢查任何選中的複選框並顯示子項。

下面是我的意思的一個例子 - 不是僅僅添加更改事件，而是在頁面加載時爲每個更新調用update。這段代碼可能並不準確，我現在沒有時間對它進行測試，但它應該能夠得出總體思路。我是一個MooTools人，所以如果jQuery不完全正確，請原諒我。

$(document).ready(function(){ 

    $("input[id$=Suffix]").each(function(el){ 
    el.change(function(){ updateCheckbox(this); }); 
    updateCheckbox(el); 
    }); 

}); 

function updateCheckbox(chk){ 
     prefix = chk.id; 

     if (!$(chk).hasClass("checked")) { 
      $("tr[id^=" + prefix + "]").show(); 
      $(chk).addClass("checked"); 
     } 
     else { 
      $("tr[id^=" + prefix + "]").hide(); 
      $(chk).removeClass("checked"); 
     } 
}

來源

2010-05-21 20:17:27

這看起來很不錯，但它根本不起作用。我會一直搞亂它，看看我能得到什麼。如果我找到解決方案，將會發布。僅供參考，我得到一個錯誤，說el.change（）不是一個函數。 – 2010-05-22 16:20:47

玩完這個之後再重新排列一下，我就開始工作了。如果有人想要最終的代碼，請讓我知道。 – 2010-05-22 20:57:13

對不起，就像我說我的jQuery語法不是最好的。在您的初始文章中發佈工作代碼，我會更新我的。很高興聽到你的工作！ – 2010-05-24 14:07:19

在頁面加載時基於複選框值的jQuery顯示

回答

相關問題