需要按两次删除按钮才能删除 Node.js 应用程序中的 post

Question

在之前使用自定义 js 确认的 nodejs 应用程序中，所以我删除了它并使用 Bootblox.js 应用确认。

按下删除 post 按钮后，它会要求确认，确认后它不会删除 post...而是在再次按下删除按钮后将其从页面中删除....

之前使用自定义 JS 的代码确认是-

<form method="POST" action="/delete/<%= one._id %>?_method=DELETE" style="display: inline;">

            <button class="btn btn-sm btn-danger delete-button" 
              style="color: white;" 
              href="/delete/<%= one._id %>"
              onclick="return confirm('Are you sure you want to delete this?')">

              <i class="fas fa-trash"></i>

              </button>
</form>

我用 bootblox.js-

代替上面的代码

在Html标签中-

<form method="POST" action="/delete/<%= one._id %>?_method=DELETE" style="display: inline;">

            <button class="btn btn-sm btn-danger delete-button" 
              style="color: white;" 
              href="/delete/<%= one._id %>"
              type="button"
              onclick="return askConfirm(' Warning! ','Are you sure you want to delete this?')">

              <i class="fas fa-trash"></i>

              </button>

 </form>

在srcipt标签中-

var confirmVariable = false;

function askConfirm(title,message){

       bootbox.confirm({
       title: title,
       message: message,
       buttons: {
       cancel: {
           label: '<i class="fa fa-times"></i> Cancel'
       },
       confirm: {
           label: '<i class="fa fa-check"></i> Confirm'
       }
      },
      callback: function (result) {
        if(result){
          confirmVariable=true;
        } else {
          confirmVariable=false; 
        }
       }
      });

        if(confirmVariable==true){
            return true;
        }else{
            return false;
        } 
  }

如 custom/default JS 在选择 'OK' 或 'Cancel' 时确认 return 是 'true' 或 'false'，确认使用另一个js库没有，所以我在这里做了一个函数'askConfirm()'，它在脚本标签中定义。在此函数中，它将打开确认 window 并打开选择确定或取消它将设置变量 'confirmVariable==true' 或 'confirmVariable==false' 并将 return 设置为 'onclick' html 标签。所以就像默认确认一样，希望一次性提交删除表单并从页面中删除。

但问题是当我按下删除按钮时确认 window 出现并且选择确定后它不会删除 post...而是当我在此之后再次单击删除按钮时它删除它。

我想一次性删除。怎么做出来的？请帮忙！提前致谢！

Answer 1

您在设置之前检查 if(confirmVariable==true) 时遇到了问题。这是一个典型的异步问题，您在操作完成之前检查某些内容。

等待用户点击的地方confirm/cancel，你设置变量的位置在回调中，所以只有当用户点击按钮时才会改变。您在用户点击之前立即检查结果，我认为一开始是错误的。然后用户点击，值就改变了。现在，当用户第二次点击时，您会立即检查他们点击的内容，而您会不小心看到他们第一次点击的按钮。

因此，当您向用户提供弹出窗口时，最好在回调中执行操作


  bootbox.confirm({
       title: title,
       message: message,
       buttons: {
       cancel: {
           label: '<i class="fa fa-times"></i> Cancel'
       },
       confirm: {
           label: '<i class="fa fa-check"></i> Confirm'
      }
    },
    callback: function (result) {
      if(result)
         doThis(true)
      else 
         doThis(false)
    }
  });

  function doThis(confirmed){
     if (confirmed)
       console.log('user clicked confirm')
     else 
       console.log('user clicked cancel')
  }

如果你想要风格点，你可以简单地这样做

bootbox.confirm({
       title: title,
       message: message,
       buttons: {
       cancel: {
           label: '<i class="fa fa-times"></i> Cancel'
       },
       confirm: {
           label: '<i class="fa fa-check"></i> Confirm'
      }
    },
    callback: doThis
  });

  function doThis(confirmed){
     if (confirmed)
       console.log('user clicked confirm')
     else 
       console.log('user clicked cancel')
  }

需要按两次删除按钮才能删除 Node.js 应用程序中的 post

Need to press delete button twice for deleting a post in Node.js application

javascript

jquery

node.js

confirm

bootbox