表单提交，页面滚动到必填项位置


<body>
    <div style="display:flex;flex-flow: column;">
        
        1<input value="" style="margin:200px; border:1px solid red"></input>
        2<input value="" style="margin:200px; border:1px solid red"></input>
        3<input value="" style="margin:200px; border:1px solid red"></input>
        4<input value="" style="margin:200px; border:1px solid red"></input>
        5<input value="" style="margin:200px; border:1px solid red"></input>
        6<input value="" style="margin:200px; border:1px solid red"></input>
    </div>
 
    <button onClick="test()">tijiao</button>
    <script>
        function test(){
            const inputs = Array.from(document.getElementsByTagName('input'));
            const emptyIndex = inputs.findIndex(input => input.value === '');
            inputs[emptyIndex].scrollIntoView({behavior: 'smooth'});
 
        }
    </script>
    </body>

还有使用锚点来实现的方式，比较方便


<!DOCTYPE html>
<html>
<head>
    <style>
        /* 用于创建占位符，确保定位不被导航栏等固定元素遮挡 */
        #placeholder {
            display: block;
            height: 100px;
            margin-top: -100px;
            visibility: hidden;
        }
    </style>
</head>
<body>
    <nav>
        <ul>
            <li><a href="#section1">跳转到 Section 1</a></li>
            <li><a href="#section2">跳转到 Section 2</a></li>
            <li><a href="#section3">跳转到 Section 3</a></li>
        </ul>
    </nav>
    <div id="placeholder"></div>
    <section id="section1" style="margin:900px">
        <h2>Section 1</h2>
        <!-- 内容 -->
    </section>
    <section id="section2" style="margin:900px">
        <h2>Section 2</h2>
        <!-- 内容 -->
    </section>
    <section id="section3" style="margin:900px">
        <h2>Section 3</h2>
        <!-- 内容 -->
    </section>
</body>
</html>

相关阅读:
Spring bean到底是如何创建的？（上）
【数据加密、解密】前后端数据传输的过程中，如何进行数据加密传输，保证数据的传输安全，防止被他人窃取
Jetpack Compose 介绍和快速上手
vmware虚拟机启动、使用ubuntu问题
雷达实测数据的信噪比
2023年阿里云新用户云服务器价格表
xss跨站脚本（cross-site scripting）
Android修行手册 - LinearLayout线性布局全解析
python经典百题之删除指定字母
计算机Java项目｜Springboot房产销售系统

原文地址：https://blog.csdn.net/m0_47999208/article/details/133068780