在页面加载时基于复选框值的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显示

回答

相关问题