So implementieren Sie ein sekundäres Verknüpfungsmenü in PHP-PHP-Problem-php.cn

So implementieren Sie ein sekundäres Verknüpfungsmenü in PHP

藏色散人

Freigeben： 2023-03-09 06:42:01

Original

2903 Leute haben es durchsucht

So implementieren Sie ein sekundäres Verknüpfungsmenü: Erstellen Sie zuerst HTML-Dateien und PHP-Dateien, schreiben Sie dann Front-End-Code und Back-End-Logikcode und senden Sie schließlich JS, um den Wert anzuzeigen die Seite.

So implementieren Sie ein sekundäres Verknüpfungsmenü in PHP

Die Betriebsumgebung dieses Artikels: Windows 7-System, PHP-Version 7.1, DELL G3-Computer

PHP + Ajax-Implementierung einer sekundären Verknüpfungsmenüfunktion – Beispiel

So erreichen Sie eine sekundäre Verknüpfung

Funktionsprinzip

Die Verknüpfung auf zweiter Ebene ist ein relativ häufiger technischer Punkt in der Entwicklung. Sie verwendet hauptsächlich die lokale Aktualisierungstechnologie Ajax und aktualisiert nur die Stellen, an denen wir den Wert ändern müssen Schauen Sie sich zunächst den Arbeitsablauf an.

Schritt 1: Wir senden eine Anfrage an den Hintergrund
Schritt 2: Nachdem der Hintergrund die Anfrage akzeptiert hat, gibt er uns einen Wert zurück
Schritt 3: Präsentieren Sie den Wert auf der Seite mit JS

HTML Code

<html>
<head>
<title>www.jb51.net 二级联动</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf8">
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<style>
#area-box{width:500px;height:400px;margin:0 auto;border:0px solid #dddddd;text-align:center;}
.area-select{width:200px;height:30px;margin-top:30px;margin-left:30px;}
</style>
<head>
<body>
  <p id="area-box">
    <select class="area-select" id=&#39;address&#39;>
      <option value="0">请选择省份</option>
      <option value="1">四川</option>
      <option value="2">河北</option>
      <option value="3">湖南</option>
    </select>
    <select class="area-select" id="city">
      <option>请选择城市</option>
    </select>
  </p>
  <script>
  $(function(){
    //初始化数据
    var url = &#39;address.php&#39;; //后台地址
    $("#address").change(function(){ //监听下拉列表的change事件
      var address = $(this).val(); //获取下拉列表选中的值
      //发送一个post请求
      $.ajax({
        type:&#39;post&#39;,
        url:url,
        data:{key:address},
        dataType:&#39;json&#39;,
        success:function(data){ //请求成功回调函数
          var status = data.status; //获取返回值
          var address = data.data;
          if(status == 200){ //判断状态码，200为成功
            var option = &#39;&#39;;
            for(var i=0;i<address.length;i++){ //循环获取返回值，并组装成html代码
              option +=&#39;<option>&#39;+address[i]+&#39;</option>&#39;;
            }
          }else{
            var option = &#39;<option>请选择城市</option>&#39;; //默认值
          }
          $("#city").html(option); //js刷新第二个下拉框的值
        },
      });
    });
  });
  </script>
</body>

Nach dem Login kopieren

[Empfohlenes Lernen: PHP-Video-Tutorial]

PHP-Code

<?php
  $key = $_POST[&#39;key&#39;]; //获取值
  $address[1] = array(&#39;成都&#39;,&#39;绵阳&#39;,&#39;德阳&#39;);
  $address[2] = array(&#39;石家庄&#39;,&#39;唐山&#39;,&#39;秦皇岛&#39;);
  $address[3] = array(&#39;长沙&#39;,&#39;株洲&#39;,&#39;湘潭&#39;);
  if(!empty($address[$key])){ //有值，组装数据
    $result[&#39;status&#39;] = 200;
    $result[&#39;data&#39;] = $address[$key];
  }else{ //无值，返回状态码220
    $result[&#39;status&#39;] = 220;
  }
  echo json_encode($result); //返回JSON数据
?>

Nach dem Login kopieren

Wirkungseffekt:

Tatsächlich sind die Prinzipien der Verknüpfung der dritten Ebene und der Verknüpfung der zweiten Ebene dieselben , aber in anderen Fällen wiederholen Sie es einfach einmal

Das obige ist der detaillierte Inhalt vonSo implementieren Sie ein sekundäres Verknüpfungsmenü in PHP. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!