1.1 해결 방법 1
Form 작업에서 데이터를 제출하지만 페이지가 점프하지 않는 경우 Iframe을 사용하여 해결할 수 있습니다.
예:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Form提交表单页面不跳转</title>
</head>
<body>
<form action="" method="post" target="myIframe">
<label for="input_text">账户：</label>
<input type="text" id="input_text" name="input_text">
<label for="input_pwd">密码：</label>
<input type="text" id="input_pwd" name="input_text">
<input type="submit" id="submit" name="submit" value="提交">
</form>
<iframe id="myIframe" name="myIframe"></iframe>
</body>
</html>참고: Form 요소의 target 속성은 반환된 결과를 지정하는 iframe 요소의 name 속성이어야 합니다.
Iframe 요소는 본문이나 양식 요소 어디에나 배치할 수 있습니다.
1.2 Ajax를 사용하여 구현, 새로 고침 기술 없음
javascript를 사용하여 입력 요소의 값을 직접 읽은 다음 ajax가 처리할 함수의 변수에 넣습니다.
예 - 양식 데이터를 직렬화하는 js serialize 또는 serializeArray 메서드:
<form>
First name: <input type="text" name="FirstName" value="Bill" /><br />
Last name: <input type="text" name="LastName" value="Gates" /><br />
</form>
<button id="btn">序列化表单值</button>
$("#btn").click(function(){
var x=$("form").serializeArray();
console.log(x); //执行结果：[{name: "FirstName", value: "Bill" },{name: "LastName", value: "Gates" }]
var y=$("form").serialize();
console.log(y); //执行结果：FirstName=Bill&LastName=Gates
}); 참고: serializeArray() 메서드는 json 값을 반환하고 serialize() 메서드는 문자열 값을 반환합니다.
위 내용은 양식 양식을 HTML로 제출할 때 페이지가 이동하는 것을 방지하는 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!