<p>사용자 이름을 가져오는 간단한 양식이 있으며 다음을 달성하고 싶습니다. </p>
<li>사용자가 버튼을 클릭하면 여러 번의 클릭을 방지하기 위해 버튼이 비활성화됩니다(실제 경우 API 호출, 데이터베이스 쓰기 등과 같은 모든 데이터를 처리하는 데 몇 초가 걸릴 수 있습니다). </li>
<li>클릭 후 PHP에서 $_POST['username']을 캡처하고 요청을 추가로 처리하려면 새 POST 요청이 발생해야 합니다. </li>
</ul>
<p>이 목표를 달성하는 방법은 무엇인가요? </p>
<p>코드는 다음과 같으나 예상대로 작동하지 않습니다. </p>
<pre class="brush:php;toolbar:false;"><?php
세션_시작();
// 양식이 제출되면 양식 데이터를 처리합니다.
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if(isset($_POST['제출 버튼'])) {
$uname=$_POST['사용자 이름'];
header('위치: 성공.php');
}
}
?>
<!DOCTYPE html>
<html>
<머리>
내 양식
</머리>
<본문>
<form id="your_form_id" action="test4.php"방법="게시물">
<p><label>사용자 이름</label>
<입력 id="사용자 이름" 유형="텍스트" 이름="사용자 이름" 값="" 자동 초점/>/p>
<입력 유형="제출" id="제출 버튼" 값="로그인" />
</양식>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<스크립트 유형="텍스트/자바스크립트">
$("#submit-button").on("클릭", function(e){
document.getElementById("submit-button").disabled = true;
document.getElementById("submit-button").value="처리 중입니다. 잠시만 기다려주세요..."
document.getElementById("your_form_id").submit();
});
</스크립트>
</body>
</html></pre></p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
JQuery 라이브러리를 사용하고 있지만 버튼과 submit()을 처리하기 위해 기본 JavaScript 명령을 사용하고 있습니다. Pure JS를 모두 사용하거나 JQuery를 모두 사용합니다.
아래 코드는 JQuery만 사용합니다. 또한 제출을 버튼으로 대체했습니다.
. 마지막으로 버튼은 POST되지 않으므로 테스트가 필요한 경우 입력 필드에서 수행하세요.
아래는 방금 언급한 요소가 포함된 코드로, 도움이 될 것입니다.
으아악이를 달성하려면 다음 원칙을 사용할 수 있습니다.
test-a.php: 으아악
test-b.php: 으아악
test-c.php: 으아악