jquery - 控制 jQuery 点击事件的顺序

Question

我正在开发一个小项目，它需要一些按钮，当您单击它们时，它会展开它们下面的菜单，向用户显示一些他们可以选择的选项，但是 - 我如何动态控制事件的顺序？

例如:我需要先选择颜色，然后才能选择尺寸等更多选项。

编辑:

以此为例:http://www.notebookbuilder.co.uk

我开发了这个(很久以前)，看看它的功能。

我希望能够轻松维护它，因为目前添加和编辑功能绝对是一场噩梦。

正如您所看到的，在选择笔记本尺寸之前，您无法进入“下一个级别”，然后当您选择尺寸时，会出现 Material 选项 - 但您无法单击颜色。

Answer 1

如果我理解正确的话，比如说，您有 5 个“操作”，同时显示在同一页面上，并且您希望用户先执行操作 1(例如，选择一种颜色)，然后才能执行操作 2(例如，选择尺寸)。

创建一个大小为5的数组，在每个元素中放入“false”，当操作1完成时，在数组的元素1中放入true，当用户点击操作2时，检查数组元素1是否为true才允许用户与其交互。

如果您希望它更加易于维护和通用，请使用对象而不是数组，并为每个操作使用标签(例如“颜色”、“大小”等)。如果还允许您进行更复杂的检查(例如，如果用户可以按顺序选择尺寸和颜色，但在选择付款方式之前必须选择两者......找不到更好的示例:D)。这样您还可以向用户提供反馈“您必须先选择颜色”。

假设您保存已完成操作的对象称为“操作”:

$('#buttonSize').click(function() {
    // Do whatever you need
    // ...
    actions['size'] = true;
});

$('#buttonColor').click(function() {
    // Check here
    if (!actions['size'] === true) {
        alert("Select a size first");
    }
    // Do whatever you need
    // ...
    actions['color'] = true;
});

等等。