利用AJAX和javascript为Djangos消息传递框架创建一个toast

<div id="toast-container"></div>

function getToastMessage() {
  // 发送AJAX请求获取消息
  var xhr = new XMLHttpRequest();
  xhr.open('GET', '/get-toast-message/', true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      var message = xhr.responseText;
      // 调用显示toast的函数
      showToast(message);
    }
  };
  xhr.send();
}

function showToast(message) {
  var toastContainer = document.getElementById('toast-container');
  var toastElement = document.createElement('div');
  toastElement.className = 'toast';
  toastElement.innerHTML = message;
  toastContainer.appendChild(toastElement);
  // 设置一定时间后自动隐藏toast
  setTimeout(function() {
    toastElement.style.display = 'none';
  }, 3000);
}

.toast {
  position: fixed;
  top: 20px;
  right: 20px;
  padding: 10px;
  background-color: #333;
  color: #fff;
  border-radius: 5px;
}