从视图 A 调用视图 B 中的 jquery 函数

Posted 2023-02-22

【中文标题】从视图 A 调用视图 B 中的 jquery 函数

【英文标题】：Calling a jquery function within a view B from a view A

【发布时间】：2013-10-08 15:06:13

【问题描述】：

我在我的 asp.net mvc4 Web 应用程序中有一个视图，用户可以从中配置一些与之相关的内容。当用户单击此视图中的按钮时，例如配置视图，我想在另一个视图中调用 jquery 函数，例如主视图。这个 jquery 函数负责修改主视图中的元素。

在按钮所在的配置视图中，我有以下代码、一些输入文本框和按钮（这在配置控制器中调用 AddItem 操作）：

   @using (html.BeginForm("AddItem", "Configure", FormMethod.Post))
      
        @Html.DropDownListFor(m => m.CustomViewModel.SelectedItemId, Model.CustomViewModel.ListItems)
        @Html.TextBox(...)
        <input id="submitAdd" type="submit" value="@Resource.ButtonTitleAdd" />
   

那么当用户点击配置视图上的按钮时，如何从上面的代码中调用主视图中的jquery函数呢？

我还需要将配置视图下拉列表中的值选择传递给这个 jquery 函数。例如，如果下拉列表包含：

“某物1” “东西2” “某事3”

我需要传递下拉列表中所选项目的值。例如，如果用户选择“something1”并且其值为 1，则应将 1 传递给此 jquery 函数。此下拉列表中填充了模型。

【参考方案1】：

我会用一个自定义事件来解决它，你可以从任何你喜欢的地方触发和收听。

像这样触发它：

$.event.trigger('customStuff', [arg1, arg2, argN]);

然后像这样“听”它：

$(document).on('customStuff', function (e, arg1, arg2)  );

【讨论】：

好的，所以在我的主视图中我监听这个事件，并从按钮所在的配置视图中触发它。但是如何在我发布的代码中单击按钮时触发此事件？我必须把那条线放在哪里？抱歉，我是新手……

@user304602 抱歉，有一段时间没用了。你想清楚了吗？

我认为你可以监听提交事件（像这样在表单中添加一个名称：Html.BeginForm("AddItem", "Configure", FormMethod.Post, htmlAttributes: new @name="somename") 并像这样使用它：$('form[name="somename"]').submit(function() _trigger event_ )，例如获取这篇文章中的数据：@ 987654321@

最后一个解决方案与您评论的第一个解决方案有什么区别？哪个更正确？

@user304602 我只发布了一个解决方案。我会说这比简单地监听提交事件更通用。这可以添加到任何地方。

【参考方案2】：

当您使用 jQuery 时。我认为像 pubsub 这样的东西是你最好的选择，它鼓励基于事件的松散耦合。例如：

(function($) 

  var o = $();

  $.subscribe = function() 
    o.on.apply(o, arguments);
  ;

  $.unsubscribe = function() 
    o.off.apply(o, arguments);
  ;

  $.publish = function() 
    o.trigger.apply(o, arguments);
  ;

(jQuery));

现在您可以使用以下代码：

// You can pass your custom data here
$.subscribe("firefunction", function(e, a, b, c) 
  console.log(a + b + c);
);

$.publish("firefunction", [ "a", "b", "c" ]);
// logs: abc

// Unsubscribe all handlers for this topic
$.unsubscribe("firefunction");