javascript - OnChange 和 Click 同时进行

Question

我有以下情况:

两个像这样的“控件”:

<span class="search-select">
    <select id="Item_TBUID" name="ViewModel.SearchTbuid">
        <option value="" style="display: block;" selected="selected">ALL</option>
    </select>
    <input class="textfield" id="textfield_SearchTbuid" name="textfield.SearchTbuid" type="text" value="" />
</span>

“控件”涉及几个事件。

• focusout 上的 input.textfield 触发 select 的 change 事件(通过触发器)。
• select 的 change 事件触发 ajax 调用来更改第二个 Control 的选项(简单地说，级联下拉菜单)。

当我在输入中输入内容(过滤第一个控件选择的选项)，然后立即单击第二个控件的下拉列表(级联)时，它会部分加载新数据。如果我只是失去选择焦点并再次单击它，它将完全加载新数据(来自 ajax 调用)。

我知道下面的代码不是非常有用，但我不想粘贴一堆代码，因为其中 90% 是不相关的，因为我要询问事件、它们的顺序等。

/* Applies the SearchSelect plugin to all controls 
 *  which filters the select's options and triggers the
 *  select's change event when the textfield loses focus.
 */
$(".search-select").SearchSelect();

/* Applies cascading event to the select element.
 * Which makes an ajax call for the new options.
 *  The success event of the ajax call then adds the options
 *      to the second control's select.
 */
cascade(RetailerCostZone);

问题:我如何告诉显示选项的选择单击事件等待 AJAX 调用完全完成？

Answer 1

您是否考虑过将 ajax 调用放在另一个控件的 onclick 或 onfocus 上，并成功触发其正常行为？这样每次你关注它时它都会首先获得正确的数据？

此外，由于第二个控件中的数据依赖于第一个控件中的数据，因此也许您可以在第一个控件上使用一个提交按钮来加载第二个控件的选项。