Question

我正在使用ASP.NET MVC和jQuery。

我的js文件中有这个代码。当用户点击单选按钮时，它应隐藏并显示某些div。我还想使用触发器方法在页面加载上触发此操作。我的问题似乎是当事件触发时，模型中的默认值尚未加载到控件中，并且两个复选框都为false。我的代码似乎是正确的，但触发器只是很快就会触发。有没有办法告诉jQuery触发器在模型数据加载到控件之前不会触发？

 $(function() { $('table#ScheduleTable
 input.DailyFrequency,
 input.WeeklyFrequency').click(function()
 {
     if ($(this).attr('checked') == true & $(this).val() == "Daily") {
         $('.dailyOption').children().show();
         $('.weeklyOption').children().hide();
     };
     if ($(this).attr('checked') == true & $(this).val() == "Weekly") {
         $('.dailyOption').children().hide();
         $('.weeklyOption').children().show();
     } });

 $('table#ScheduleTable
 input.DailyFrequency,
 input.WeeklyFrequency').trigger('click');
 });

Answer 1

如何将值加载到页面上？因为它们通常不是问题，因为它们在html输出中，并且JQuery会等到使用$（function（）{}逻辑加载它。

由于您的触发器位于$（function（）{}逻辑中，因此一旦页面加载，它就会立即运行click事件。

例如，如果您通过ajax加载值，则需要在ajax调用完成后调用触发器。

Answer 2

我刚刚在firefox和$（function（）{}）和$（document）.ready（function（）{}）中尝试过它似乎行为相同，尽管.ready表单似乎是由jquery推荐的。也许$（document）.load可以更好地工作，因为在某些浏览器上可能会发生默认值以后填充？它在所有浏览器上的行为是否相同，或仅在某些浏览器上表现相同？

Answer 3

如果您链接这些命令会发生什么？ E.g。

$(function() { $('table#ScheduleTable
 input.DailyFrequency,
 input.WeeklyFrequency').click(function()
 {
     if ($(this).attr('checked') == true & $(this).val() == "Daily") {
         $('.dailyOption').children().show();
         $('.weeklyOption').children().hide();
     };
     if ($(this).attr('checked') == true & $(this).val() == "Weekly") {
         $('.dailyOption').children().hide();
         $('.weeklyOption').children().show();
     } }).trigger('click');
 });

我怀疑使用您当前的脚本，jQuery首先会设置click事件函数，然后正在调整jQuery，然后继续设置触发器事件。

也许如果你链接它们，jQuery将被强制完成点击片段，然后再分配触发器？

Answer 4

代码已更新至以下内容。它现在有效。谢谢你的回复！：）

$('table#ScheduleTable input.DailyFrequency,
input.WeeklyFrequency'）。单击（（）的函数 { UpdateScheduleView（）; }）;
function UpdateScheduleView() {
    if ($('input.DailyFrequency').attr('checked')
== true）{ $（ 'dailyOption。'）儿童（）显示（）。; $（ 'weeklyOption'）儿童（）隐藏（）。 } 其他{ $（ 'dailyOption。'）儿童（）隐藏（）。 $（ 'weeklyOption'）儿童（）显示（）。; } }
if ($('table#ScheduleTable input.DailyFrequency').length > 0) {
    UpdateScheduleView();

Answer 5

您应该使用ready事件：

$(document).ready(function () {
  // do you jquery initialization here
   $('table#ScheduleTable....
  ...
});

http://docs.jquery.com/Events/ready

在我的数据加载到页面控件之前触发JQuery

5 个答案: