如何将参数传递给 jQuery document.ready() 函数（ASP.NET MVC、C#）
Posted
技术标签:
【中文标题】如何将参数传递给 jQuery document.ready() 函数（ASP.NET MVC、C#）【英文标题】：How to pass parameters to jQuery document.ready() function (ASP.NET MVC, C#) 【发布时间】：2011-08-24 00:46:32 【问题描述】：我想从我的视图中将参数传递给 jQuery document.ready() 函数：
$(document).ready(function (parameter)
$('select[name=Product]').val(parameter);
);
如何从我的视图中触发事件并传递参数？我使用 Razor 作为视图引擎。
谢谢
【问题讨论】：
【参考方案1】：你不能。 document.ready 函数不带参数。例如，您可以将此参数定义为视图中的全局变量：
<script type="text/javascript">
var model = @html.Raw(Json.Encode(Model));
</script>
然后在你单独的 javascript 文件中使用这个全局变量：
$(function()
$('select[name=Product]').val(model.SomeProperty);
);
【讨论】：
感谢您的回答。我使用母版页 (_Layout) 放置 和所有 Javascript，但我想将此行为限制为特定视图。 @Francesco，在这种情况下，您可以在 _Layout 中定义一个Scripts 部分，您可以在特定视图中覆盖该部分，其中包含全局 javascript 变量的定义。
我使用了这个实现，但没有 @Html.Raw(Json.Encode()) 部分。【参考方案2】：
为避免使用全局变量，可以定义一个闭包，然后将此函数返回给ready()：
function start(parameter)
return function()
/*...use parameter */
alert('parameter: ' + parameter);
然后拨打ready():
$(document).ready(start('someValue'));
您还可以在外部 .js 文件中定义启动函数，并在主 html 文件中调用 ready（例如）。 例子： 外部脚本.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; ?>'));
【讨论】：
【参考方案3】：您可以通过闭包有效地完成此操作。也就是说，如果您正在调用类似 $(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 步方法是：
-
参数化函数。
将函数体包装在一个闭包中。即
return function() ...。
参数化主体。
使用参数调用函数。
将其应用于上述代码：
<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 closures。
【讨论】：
我不明白为什么您需要步骤 2 和 3。步骤 1 和 4（参数化并使用该参数调用）就足够了，不是吗？你有'启动'函数范围来隐藏你的变量和里面的所有东西。为什么需要额外的功能？ 根据您指出的那个“JavaScript 闭包”问题，“在 JavaScript 中，如果您在另一个函数中声明一个函数，那么外部函数的局部变量在从它返回后仍然可以访问。”所以这是一种私人访问它们的方法。 如果你只做了第 1 步和第 4 步，startup(7) 会返回什么？答：没什么。这就是为什么您需要第 2 步和第 3 步来返回函数的原因。 $(document).ready(f) 不会立即执行 f。一旦文档准备好，它就会调用f()。你需要给它传递一个函数。【参考方案4】：
如果参数值内联在您的视图中，您可以简单地将参数值回显到 Javascript 代码中。
$(document).ready(function ()
$('select[name=Product]').val('@ViewBag.Parameter');
);
【讨论】：
感谢您的回答。我从不使用 ViewBag，因为我无法测试它的行为 ViewBag 只是一个例子。当然，这也适用于模型属性。以上是关于如何将参数传递给 jQuery document.ready() 函数（ASP.NET MVC、C#）的主要内容，如果未能解决你的问题，请参考以下文章
如何通过将参数传递给 URL 来使用 jQuery 刷新页面