如何在选择元素中确定两个更改事件的优先级答案

【问题标题】：How to prioritize two change events in select element如何在选择元素中确定两个更改事件的优先级
【发布时间】：2011-03-16 15:37:52
【问题描述】：

我有两个用于一个选择元素的更改事件处理程序。让我们调用函数 Func1 和 Func2。当我初始化这些处理程序时，我先执行 Func1，然后执行 Func2，但是当 select 元素中发生更改事件时，Func2 在 Func1 之前被调用。

有没有办法优先考虑这两个功能。只是为了让您知道每个函数的初始化都在不同的脚本中。

这是我的代码布局

脚本1：

$("select#myDropdownlist").change(function(){
    $(this).parents('form:first').submit();
   // form submit sends post request to update an object which is in session
}

脚本2：

$("select#myDropdownlist").change(function(){
    Send an ajax request and return json result based on the changes happened to the object in script1 function
}

虽然我按顺序初始化了这些，但它并没有按顺序调用函数。因为它先调用 Func2 对象还没有更新所以结果不正确，然后它会调用 Func1 并且对象将被更新，这为时已晚，因为 Func2 已经根据之前版本的对象返回了结果。

还请注意，Script1 非常通用，它应该适用于任何表单数据输入页面，其中 Script2 特定于特定页面，一旦选择元素仅在页面中更改，我想做额外的事情.这意味着我不能在 Func2 中调用 Func2。

任何帮助将不胜感激

问候

Behnam Divsalar

【问题讨论】：

标签： javascript jquery

【解决方案1】：

在事件之后排序函数的简单答案是添加一个事件处理函数，该函数一个接一个地运行这 2 个函数。

$("select#myDropdownlist").change(function(){
    callFirstFunction();
    callSecondAjaxFunction();
}

【讨论】：

【解决方案2】：

将第一个函数的内容放入方法中怎么样：

$("select#myDropdownlist").change(function(){
  submitPostFunction1();
}

submitPostFunction1 = function() {
  //do function 1 stuff here
}

然后在您更具体的功能 - 功能2：

$("select#myDropdownlist").change(function(){
  $("select").unbind();
  submitPostFunction1();
  //do function 2 stuff
  $("select").bind("change", function() {
    submitPostFunction1();
  })
}

请记住，我在函数 2 中使用了 $("select")，因为您说这是一个更通用的调用，所以这意味着您不会在第一个函数调用中使用 id。

【讨论】：

【解决方案3】：

未指定事件以任何特定顺序触发。

如果您想要一个特定的顺序，您需要从元处理程序调用它们，或者通过调用另一个来链接它们。但从长远来看，元处理程序更加灵活。

$("select#myDropdownlist").change(function(){
    firstHandler();
    secondHandler();
}

或

function firstHandler() {
    ...
    secondHandler();
}
function secondHandler() {
    ...
}

$("select#myDropdownlist").change(firstHandler);

【讨论】：