如何将参数传递给jQuery document.ready()函数(ASP.NET MVC，C#)

本文关键字：ASP 函数 MVC NET ready 参数传递 document jQuery | 更新日期: 2023-09-27 17:56:19

我想从我的视图中将一个参数传递给jQuery document.ready（）函数：

$(document).ready(function (parameter){
        $('select[name=Product]').val(parameter);
});

如何从我的视图触发事件并传递参数？我使用Razor作为视图引擎。

谢谢

如何将参数传递给jQuery document.ready()函数(ASP.NET MVC，C#)

你不能。document.ready 函数不带参数。例如，您可以在视图中将此参数定义为全局变量：

<script type="text/javascript">
    var model = @Html.Raw(Json.Encode(Model));
</script>

然后在单独的 JavaScript 文件中使用此全局变量：

$(function() {
    $('select[name=Product]').val(model.SomeProperty);
});

为了避免使用全局变量，您可以定义一个闭包，然后将此函数返回到 ready() ：

function start(parameter)
{
    return function()
    {
        /*...use parameter */
        alert('parameter: ' + parameter);
    }
}

然后拨打ready()：

$(document).ready(start('someValue'));

您还可以在外部 .js 文件中定义 start 函数，并在主 html 文件中调用就绪（例如）。例：外部脚本.js：

function start(parameter)
{
   return function()
   {
        /*...use parameter */
        alert('parameter: ' + parameter);
   }
}

html 文件：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
<script>
$(document).ready(start('someValue'));
</script>
</head>
<body>
</body>
</html>

在后一个文件中调用ready()允许您将服务器参数传递给函数。示例（使用 PHP。在这种情况下，您必须将扩展名从 html 更改为 php 到此文件）：

$(document).ready(start('<?php echo $serverParameter; ?>'));

您可以通过闭包有效地完成此操作。也就是说，如果你调用的是类似$(document).ready(startup)的东西，那么你可以很容易地重写startup以便你可以用参数调用它，例如 $(document).ready(startup(7)) .巴勃罗给出了一个被低估的极好答案，值得举一个更详细的例子。

例

下面是一个页面，其中显示由$(document).ready()调用的警报，用于计算6*9：

<html>
  <head>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script>
      function startup() {
        alert('6 * 9 = ' + 6 * 9);
      }
    </script>
  </head>
  <body>
    Hello!
    <script>
      $(document).ready(startup);
    </script>
  </body>
</html>

假设您要将"9"替换为变量参数。执行此操作的 4 步秘诀是：

  1. 参数化函数。
    2. 将
  2. 函数体包裹在闭合中。也就是说，return function() {...}.
  3. 参数化主体。
  4. 使用参数调用函数。

将其应用于上面的代码：

<html>
  <head>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script>
      function startup(x) { // Step 1 - Parameterize the function
        return function() { // Step 2 - Put body in "return function() {...}"
        alert('6 * '+x+' = ' + 6 * x); // Step 3 - Parameterize the body.
        } // (closing brace for step 2)
      }
    </script>
  </head>
  <body>
    Hello!
    <script>
      $(document).ready(startup(7)); // Step 4 - Call function with parameter.
    </script>
  </body>
</html>

这将显示警报"6 * 7 = 42"。

发生了什么事情？

$(document).ready()将函数作为其参数。这就是为什么在上面的第一个版本中调用它的原因，只有startup作为参数。相反，如果您使用 startup() 调用它，您将不再传入 startup 函数，您将传入 startup 的返回值。

由于$(document).ready()将函数作为其参数，这就是我们给出的：startup在上面的第二个版本中转换为返回函数的函数，该函数的参数x设置为我们最初传递的值。也就是说，startup(7)向$(document).ready()返回一个函数，该函数的值x设置为 7 。

OP的问题

要专门将其应用于 OP 的问题，请将该调用重写为

$(document).ready((function(x) { return function() {
    $('select[name=Product]').val(x);
}})('name'));

其中'name'可以是替换x的任何其他值。不需要全局变量。

更多信息：JavaScript 闭包。

您可以简单地将参数值回显到 Javascript 代码中，如果它在您的视图中内联。

$(document).ready(function (){
        $('select[name=Product]').val('@ViewBag.Parameter');
});
相关文章：