jQuery:带有 if else 的模态对话框

Question

亲爱的大家，我需要将两个不同的结果合并在一个脚本中。 问题是这样的：

如果#edit点击了->显示对话框 ->单击对话框内的按钮#ok，然后执行功能：

if($('#user').val() !== "admin" || $('#password').val() !== "qaubuntu") {
                  alert('Invalid login');
                  return false;
                  } else {
                            $('#dialog').dialog('close');
                            $('#tabs').show();
                            $('#editdata').show();
                            return false;
                            }

如果单击#del ->显示对话框 ->单击对话框内的按钮#ok，然后执行功能：

if($('#user').val() !== "admin" || $('#password').val() !== "qaubuntu") {
                      alert('Invalid login');
                      return false;
                      } else {
                                $('#dialog').dialog('close');
                                $('#tabs').show();
                                $('#deletedata').show();
                                return false;
                                }

你能告诉我该怎么做吗？

Answer 1

使用类链接“

 var flag="";
 $(".openDialog").click(function () { 
 flag=$(this).attr('id');
 //now call show dialog here.....
 });

确定”按钮内的“openDialog”检查标志

if($('#user').val() !== "admin" || $('#password').val() !== "qaubuntu") {
              alert('Invalid login');
              return false;
              } else {
                        $('#dialog').dialog('close');
                        $('#tabs').show();
                        //------------------
                          if(flag=='edit')
                             $('#editdata').show();
                          else if(flag=='del')
                             $('#editdata').show();
                        //-------------------
                        return false;
                        }

Answer 2

我可能会将 click 事件绑定到类或类型选择器而不是 id，并使用类来区分单击的元素。

例如，

if($(this).hasClass("edit")){
    $('#editdata').show();
    return false;
}else{
    $('#deletedata').show();
    return false;
}

您还可以将删除数据/编辑数据显示函数移动到一个单独的函数中，并使用一个标记要显示哪个函数的参数。

例如

function showDialogue(isEdit){
    if(isEdit === true){
            $('#editdata').show();
            return false;
    }else{
            $('#deletedata').show();
            return false;
    }
};