javascript - 새로 고치지 않은 양식 제출을 달성하기 위해 jquery의 ajax와 php를 함께 사용할 때 발생하는 문제

표시된 사진은 홈페이지 링크를 열면 메인 부분(왼쪽 검은색 상자)이 표시됩니다.
오른쪽 서브페이지(div#main_box에서 ajax를 통해 얻은 서브페이지) 그렇죠)
처음 홈페이지 링크를 열었을 때, 버튼을 누르면 로딩되는 서브페이지가 나옵니다

이제 버튼 2를 누르면 로드되는 하위 페이지 2에 양식이 있습니다. 양식을 제출한 다음 PHP를 통해 양식에서 제출한 값을 가져온 다음 데이터베이스로 이동하여 정보를 쿼리해야 합니다. 데이터베이스 데이터를 반환한 다음 이 하위 페이지에 출력합니다. 2. 이를 달성하는 방법을 모릅니다.

오랜 시간 인터넷 검색 끝에 이 방법을 찾았습니다.

<code><form action="teacher.php" method="post">
      <p>学期</p>
      <select name="xueqi" id="xueqi">
            <option value="201520161">2015-2016学年第一学期</option>
            <option value="201520162">2015-2016学年第二学期</option>
            <option value="201620171">2016-2017学年第一学期</option>
      </select>
</form>
<script>
$(function(){
$("#jiansuo").click(function(){
             var xueqi = $("#xueqi").val();//取得表单的值
             var one = $("#one").val();
             var one_week = $("#one_week").val();
             var more = $("#more").val();
             var more_week_num = $("#more_week_num").val();
             var more_week_ba = $("#more_week_ba").val();
             var xingqi = $("#xingqi").val();
             var banji = $("#banji").val();
            //Ajax post数据
            $.ajax({
             type: "POST",//Ajax请求为post
             url: "teacher.php?c=fankui",//ajax请求URL 脚本地址
             data: {"xueqi":xueqi,"one":one,"one_week":one_week,"more":more,"more_week_ba":more_week_ba,"xingqi":xingqi,"banji":banji}, //传递的值
             success:  function(data){  //回调函数 这里的data你可以返回HTML也可以是JSON 为了简单你返回HTML就可以了。
              $("#main_right_box").html("").html(data);//将返回的列表插入分类.
             }
            });
           });

}
</script>
</code>

그런데 사용법을 모르겠어요 조언 부탁드려요

답글 내용:

표시된 사진은 홈페이지 링크를 열면 메인 부분(왼쪽 검은색 상자)이 표시됩니다.
오른쪽 서브페이지(div#main_box에서 ajax를 통해 얻은 서브페이지) 그렇죠)
처음 홈페이지 링크를 열었을 때, 버튼을 누르면 로딩되는 서브페이지가 나옵니다

이제 하위 페이지 2에 버튼 2를 누르면 로드되는 양식이 있습니다. 양식을 제출한 다음 PHP를 통해 양식에서 제출한 값을 가져온 다음 데이터베이스로 이동하여 정보를 쿼리하고 데이터베이스 데이터를 이 하위 페이지에 출력합니다. 2. 이를 달성하는 방법을 모릅니다.

오랜 시간 인터넷 검색 끝에 이 방법을 찾았습니다.

<code><form action="teacher.php" method="post">
      <p>学期</p>
      <select name="xueqi" id="xueqi">
            <option value="201520161">2015-2016学年第一学期</option>
            <option value="201520162">2015-2016学年第二学期</option>
            <option value="201620171">2016-2017学年第一学期</option>
      </select>
</form>
<script>
$(function(){
$("#jiansuo").click(function(){
             var xueqi = $("#xueqi").val();//取得表单的值
             var one = $("#one").val();
             var one_week = $("#one_week").val();
             var more = $("#more").val();
             var more_week_num = $("#more_week_num").val();
             var more_week_ba = $("#more_week_ba").val();
             var xingqi = $("#xingqi").val();
             var banji = $("#banji").val();
            //Ajax post数据
            $.ajax({
             type: "POST",//Ajax请求为post
             url: "teacher.php?c=fankui",//ajax请求URL 脚本地址
             data: {"xueqi":xueqi,"one":one,"one_week":one_week,"more":more,"more_week_ba":more_week_ba,"xingqi":xingqi,"banji":banji}, //传递的值
             success:  function(data){  //回调函数 这里的data你可以返回HTML也可以是JSON 为了简单你返回HTML就可以了。
              $("#main_right_box").html("").html(data);//将返回的列表插入分类.
             }
            });
           });

}
</script>
</code>

그런데 사용법을 모르겠어요 조언 부탁드려요

1. iframe 기능을 사용하세요. 버튼 2의 요소는 태그이고, 원하는 버튼으로 표시하고, target 속성을 추가하면 두 번째 요구 사항이 자연스럽게 해결됩니다.

   <code>  <a href="相应的url" target="main_box_frame">按钮二</a>
     <div id="main_box"><iframe name="main_box_frame"></iframe></div></code>

2. 두 번째 버튼 라벨에 클릭 이벤트를 추가하고, ajax를 통해 main_box에 표시할 콘텐츠를 가져와서 main_box에 추가한 다음 검색된 양식의 submit 이벤트에 연결하고 form 응답을 받아 main_box에 삽입하세요.

내 접근 방식은 기본 제출 이벤트를 비활성화하고 jq의 ajax를 사용하여 요청을 보내고 데이터를 사용하는 것입니다.
양식 데이터에 대해 $(formSelector).serialize() 값을 별도로 읽을 필요가 없습니다. , 콜백 함수를 통해 페이지가 새로 고쳐집니다.

알고 있습니다. Ajax가 반환하는 것은 실제로 Teacher.php에 인쇄된 것입니다. 예를 들어 html로 dataType 형식을 사용하면 해당 Teacher.php에서 테스트를 수행하고 직접 에코할 수 있습니다. '

안녕하세요, 다시 보내고 싶습니다

' 그러면 반환은 다음과 같습니다.function(data){alert(data)};//그것이 무엇인지 확인하세요. json, 그 다음 선생님 .php가 출력할 수 있는 유일한 데이터는 echo json encode($array)입니다. 여기서는 dataType:'json'
//제가 실수했는지 모르겠습니다= =#
/ /그건 그렇고, 아직도 그 양식이 있나요? checkForm() 함수에 ajax를 작성하고 마지막으로 false를 반환해야 합니다. 그렇지 않으면 양식 제출이 약간 빨라집니다.

<code>$.ajax({
url:"teacher.php?c=fankui",
type:"post",
data:{"xx":"xx"},
dataType:'html',
success:function(data){
//数据加载成功
},
error:function(){
//数据加载失败
}
});
</code>