자바스크립트 팝업 예제

JavaScript는 간단한 메시지를 표시하거나 메시지를 표시하고 사용자의 확인을 수행하거나 사용자의 입력 값을 가져 가는 팝업을 표시하는 등 다양한 목적을 위해 팝업 메시지를 표시하는 다양한 기본 제공 기능을 제공합니다. 당신이해야 할 모든 모달을 열어 쇼 모달 클래스를 제공하는 것입니다. 이 클래스를 제거하면 다시 숨겨진 클래스로 재설정됩니다. 자바 스크립트는 우리를 위해이 토글을 처리합니다. 웹 페이지에서 추가 작업을 수행하려면 사용자의 입력을 수행해야 하는 경우가 있습니다. 예를 들어 사용자가 선호하는 대출 기간을 기준으로 EMI를 계산하려고 합니다. 이러한 종류의 시나리오에서는 JavaScript 기본 제공 함수 프롬프트()를 사용합니다. 자바 스크립트는 창을 최소화하거나 최대화 할 수있는 방법이 없습니다. 이러한 OS 수준 함수는 Frontend 개발자에게 숨겨져 있습니다. 자바 스크립트 팝업 성가신 될 수 있지만, 그들은 또한 웹 응용 프로그램의 통합적이고 유효한 부분으로 사용할 수 있습니다. 위의 예에서 볼 수 있듯이 메시지를 첫 번째 매개 변수로 지정하고 기본값 “15”를 두 번째 매개 변수로 지정했습니다.

프롬프트 함수는 사용자가 입력한 값을 반환합니다. 사용자가 아무 것도 입력하지 않은 경우 null을 반환합니다. 따라서 계속하기 전에 null을 확인하는 것이 좋습니다. 나는 우리 모두가 널리 경멸 사랑 자바 스크립트 팝업 상자에 익숙한 신뢰? 아래에서 슬라이드 전체 너비 모달을 만드는 방법에 대한 예 : 이것은 웹에서 자바 스크립트를 사용하는 매우 일반적인 방법입니다. HTML 요소에 JavaScript를 “첨부”함으로써 페이지의 사용자 행동에 훨씬 더 반응할 수 있습니다. 자바 스크립트에는 경고 상자, 확인 상자 및 프롬프트 상자의 세 가지 팝업 상자가 있습니다. 이 페이지를 로드하자마자 (위) 예제 팝업이 나타나지 않았다는 것을 알게 될 것입니다. 관련 버튼을 클릭한 후에만 나타났습니다. 이것은 각 HTML 버튼에 코드를 배치했기 때문에 클릭 할 때 자바 스크립트가 트리거되기 때문입니다. 팝업 상자에 따라 취소 버튼이 있을 수 있으며 일부 텍스트를 입력하라는 메시지가 표시될 수도 있습니다.

이들은 모두 자바 스크립트에 내장되어 있으며 내가 “자바 스크립트 팝업 상자”라고 부르는 것입니다. “대화 상자”, “자바 스크립트 대화 상자”, “팝업 대화 상자”등이라고도 할 수 있습니다. 경우에 따라 계속하려면 사용자의 확인을 받아야 합니다. 예를 들어 업데이트된 데이터를 저장하거나 기존 데이터를 삭제하기 전에 사용자의 확인을 수행하려고 합니다. 이 시나리오에서는 자바 스크립트 기본 제공 함수 confirm()를 사용 합니다. confirm() 함수는 확인 및 취소라는 두 개의 버튼이 있는 사용자에게 팝업 메시지를 표시합니다. 사용자가 클릭한 단추를 확인하고 그에 따라 진행할 수 있습니다. JavaScript 코드를 페이지 하단에 배치하여 요소를 쿼리하기 전에 처리해야 합니다. 그렇지 않으면 코드가 당신에게 오류를 줄 것이다! 이 자습서에서는 CSS 및 자바 스크립트를 통해 간단한 모달을 만듭니다. 실제로 Sabe에서 사용하는 모달이 이 자습서의 끝에 있는 피드백 옵션에 사용하는 것과 동일한 코드와 구조를 사용합니다. 일반적으로 사용되지 않는 덜 지원되는 브라우저 별 기능도 많이 있습니다. 예를 들어 MDN에서 window.open을 확인합니다.

나는 자바 스크립트 팝업 창을 의미하지 않는다 (아마 더 사랑!). 내 말은, 확인 버튼과 함께 메시지를 표시 하는 팝업 상자. 자바 스크립트 경고 상자를 만들려면 alert() 메서드를 사용합니다. 다음은 예: 이 예제에서는 JavaScript에서 팝업 콘텐츠를 생성합니다.