Ajax/javascript 删除 确认文本而不带对话框

Ajax/Javascript Delete Confirm Text Without Dialog

本文关键字：对话框 文本 确认 javascript 删除 Ajax      更新时间：2023-09-26

我已经到处搜索，但似乎在任何地方都找不到我想要实现的任何示例。

我有一个删除按钮，

当您按下按钮时，我希望文本出现在屏幕上，而无需刷新页面，询问具有是/否超链接（不是按钮）的用户是否要删除他们的消息。我严格不想使用模态或对话框，我只想在屏幕上显示文本。

我已经在ajax页面上尝试了以下脚本，但没有完全按照我想要的方式进行操作：

function loadDoc() {
  var xhttp;
  if (window.XMLHttpRequest) {
    // code for modern browsers
    xhttp = new XMLHttpRequest();
  } else {
    // code for IE6, IE5
    xhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      document.getElementById("demo").innerHTML = xhttp.responseText;
    }
  };
  xhttp.open("GET", "ajax_info.txt", true);
  xhttp.send();
}
<p id="demo">Let AJAX change this text.</p>
<button type='submit' name='btn-delete' id='btn-delete' onclick='loadDoc()'>Delete</button>

当我的按钮设置为提交时，我知道它在要求用户删除确认之前发布到下一页。

任何帮助将不胜感激。

提前谢谢。

WORKING JSFIDDLE

您基本上需要首先将标记包装在容器中，<div>以便在创建标记时附加确认<a>标记。

<div id="container">
  <p id="demo">Let AJAX change this text.</p>
</div>

然后创建确认<a>标记并将其附加到容器<div>。

var node = document.createElement("a");
var textnode = document.createTextNode("Yes");
node.appendChild(textnode);
node.id = 'confirm-delete';
node.href = 'javascript:void(0)';
document.getElementById("container").appendChild(node);

然后在用户单击新创建的<a>标记时触发请求。

document.getElementById('confirm-delete').onclick = function confirmation() {
  // ...
}
相关文章：