PHP에서 삭제 대화 상자를 만드는 방법

웹 애플리케이션을 개발할 때 요소 삭제와 같은 일부 작업을 수행해야 하는 상황이 많이 있습니다. 이 작업은 삭제 버튼만 있으면 구현하기 쉽습니다. 그러나 삭제 버튼이 많고 사용자가 확인하도록 하려는 경우 삭제 대화 상자가 매우 유용합니다.

이 글에서는 PHP에서 삭제 대화 상자를 만드는 방법을 설명하겠습니다.

1단계: 삭제 버튼 만들기

먼저 삭제 대화 상자를 실행하는 삭제 버튼을 만들어 보겠습니다. 아래와 같이 HTML 코드를 사용하여 버튼을 만듭니다.

<button onclick="showDeleteDialog()">删除</button>

이 버튼의 onclick 이벤트는 JavaScript 함수 showDeleteDialog()를 호출합니다. 나중에 이 기능을 JavaScript로 구현하겠습니다.

2단계: 삭제 대화 상자 구현

JavaScript와 HTML 코드를 사용하여 아래와 같이 삭제 대화 상자를 만듭니다.

<div id="deleteDialog" style="display:none">
  <p>你确定要删除吗？</p>
  <button onclick="deleteElement()">确定</button>
  <button onclick="hideDeleteDialog()">取消</button>
</div>

이 삭제 대화 상자는 단락과 두 개의 버튼으로 구성됩니다. 하나의 버튼은 삭제를 확인하는 데 사용되고 다른 버튼은 삭제를 취소하는 데 사용됩니다. 대화 상자의 ID는 "deleteDialog"이며 초기 상태는 숨겨져 있습니다.

3단계: JavaScript 함수 구현

이제 사용자가 삭제 버튼을 클릭할 때 삭제 대화 상자가 표시되도록 JavaScript 함수를 구현해야 합니다. JavaScript 코드에서 다음과 같이 showDeleteDialog() 함수를 작성합니다.

function showDeleteDialog(){
  document.getElementById("deleteDialog").style.display = "block";
}

이 함수는 getElementById() 메서드를 통해 "deleteDialog" 요소를 가져오고 해당 표시 속성을 "block"으로 설정하여 대화 상자가 표시됩니다.

4단계: deleteElement() 함수 구현

사용자가 삭제를 확인한 후 실제 삭제 작업을 수행해야 합니다. 다음과 같이 JavaScript와 PHP 코드를 통해 deleteElement() 함수를 구현합니다.

function deleteElement(){
  // 获取要删除的元素ID
  var elementID = "elementID";

  // 发送HTTP请求
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "delete.php", true);
  xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
      // 删除成功，隐藏对话框
      hideDeleteDialog();
    }
  };
  xhr.send("id=" + elementID);
}

이 함수는 삭제할 요소의 ID를 HTTP POST 메서드를 통해 서버의 PHP 스크립트로 전송합니다. PHP 스크립트가 요소를 성공적으로 삭제하면 함수는 hideDeleteDialog() 함수를 호출하여 삭제 대화 상자를 숨깁니다.

5단계: hideDeleteDialog() 함수 구현

마지막으로 삭제 대화 상자를 숨기는 함수를 구현해야 합니다. JavaScript 코드에서 hideDeleteDialog() 함수를 다음과 같이 작성합니다.

function hideDeleteDialog(){
  document.getElementById("deleteDialog").style.display = "none";
}

이 함수는 getElementById() 메서드를 통해 "deleteDialog" 요소를 가져오고 해당 표시 속성을 "none"으로 설정하여 대화 상자가 숨겨집니다.

이제 PHP에서 삭제 대화 상자를 만드는 모든 단계를 완료했습니다. HTML 코드를 사용하여 삭제 대화 상자를 트리거하는 삭제 버튼을 만듭니다. 삭제 대화 상자를 표시하려면 JavaScript 코드를 통해 showDeleteDialog() 함수를 구현하십시오. 사용자가 삭제 확인을 클릭한 후 deleteElement() 함수를 통해 실제 삭제 작업을 수행하고 hideDeleteDialog() 함수를 호출하여 삭제 대화 상자를 숨깁니다.

위 내용은 PHP에서 삭제 대화 상자를 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!