这个效果如何实现,如何做

img

提示:使用数组 存储信息,事件为change。

烟台火车站:

烟台站、烟台南站、烟台西站、桃村站、海阳北站、桃村北站、徐家店站

青岛火车站:

青岛站、青岛北站、青岛西站、莱西站、董家口站

威海火车站:

威海站、荣成站、文登东站、威海北站、乳山站、文登站

img


C# winForm简单模拟实现:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Collections;  //使用ArrayList

namespace Check009
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        #region 自定义查找某个字符第几次出现的位置
        public static int Get_StrIndexOf(string p_Str, char p_Char, int p_n)
        {
            int v_Count = 0;
            int v_n = 0;
            for (int i = 0; i < p_Str.Length; i++)
            {
                if (p_Char == p_Str[i]) v_Count++;
                if (v_Count == p_n)
                {
                    v_n = i;
                    break;
                }
            }
            return v_n;
        }
        #endregion 自定义查找某个字符第几次出现的位置

        public ArrayList v_RegionName = new ArrayList();  //保存地市
        public ArrayList v_StationName = new ArrayList(); //保存车站

        private void Form1_Load(object sender, EventArgs e)
        {
            #region 数据源
            //假设 地区表RegionList(RegionID,RegionName) 和 站表RailwayStation(RegionID,StationID,StationName)
            //从数据库表读入,或参考以下手工创建数据测试

            v_RegionName.Add("烟台");
            v_RegionName.Add("青岛");
            v_RegionName.Add("威海");

            v_StationName.Add("烟台,烟台站");
            v_StationName.Add("烟台,烟台南站");
            v_StationName.Add("烟台,烟台西站");
            v_StationName.Add("烟台,桃村站");
            v_StationName.Add("烟台,海阳北站");
            v_StationName.Add("烟台,桃村北站");
            v_StationName.Add("烟台,徐家店站");
            v_StationName.Add("青岛,青岛站");
            v_StationName.Add("青岛,青岛北站");
            v_StationName.Add("青岛,青岛西站");
            v_StationName.Add("青岛,莱西站");
            v_StationName.Add("青岛,董家口站");
            v_StationName.Add("威海,威海站");
            v_StationName.Add("威海,荣成站");
            v_StationName.Add("威海,文登东站");
            v_StationName.Add("威海,威海北站");
            v_StationName.Add("威海,乳山站");
            v_StationName.Add("威海,文登站");
            #endregion 数据源

            #region 控件内容初始化
            for (int i=0; i < v_RegionName.Count; i++)
            {
                comboBox_RegionName.Items.Add(v_RegionName[i].ToString());  //地区
            }
            //comboBox_RegionName.DropDownStyle = ComboBoxStyle.DropDownList;
            comboBox_RegionName.SelectedIndex = 0;  //默认值

            comboBox_StationName.DropDownStyle = ComboBoxStyle.DropDownList;
            #endregion  控件内容初始化
        }

        #region 利用comboBox的TextChanged事件:当地区变化时,对应站点内容变更
        private void comboBox_RegionName_TextChanged(object sender, EventArgs e)
        {
            int n = 0;
            if (comboBox_RegionName.Text != "")
            {
                for (int i = 0; i < v_StationName.Count; i++)
                {
                    n = Get_StrIndexOf(v_StationName[i].ToString(), Convert.ToChar(","), 1);  //取分隔符位置

                    if (v_StationName[i].ToString().Substring(0, n) == comboBox_RegionName.Text)
                        comboBox_StationName.Items.Add(v_StationName[i].ToString().Substring(n + 1,
                                                       v_StationName[i].ToString().Length - n - 1));  //取站名称 依需求
                }
            }
        }
        #endregion
    }
}

两个select框 。加个 ohange事件 。 第一个 变化时动态给 第二个 select 赋值 。
https://blog.csdn.net/cmy741741/article/details/121227212

这个简单的二级联动需要在第一个下拉框选中时,将第二个下拉框选项值更新。这个事自己写的思路。不过如果使用vue,react这些前端框架由专门的组件可以直接使用。