问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

点击submit后，刷新数据，但是页面还是当前页面

头像
蜡烛
    7512030

    点完submit（确定按钮）后，会跳转到其他页面，怎么阻止跳转，并且在当前页面刷新数据。图片描述

    图片描述

    javascripthtmlhtml5css
    阅读 7.1k
    3 个回答
    得票最新
    头像
    迁迁
      3238

      那得用AJAX技术了.

      头像
      smallmarkone
        1831510
        document.querySelector('#btn').addEventListener("click",function(){
    //dosomething 包括当前页面刷新数据的操作
    
    return false;    //阻止页面跳转
},false)
        头像
        蒋哲
          35332244
          <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        form {
            text-align: center;
            margin: 100px 0 0 0;
        }
    </style>
</head>

<body>
    <form action="#" onsubmit="return false">
        <p>
            <span>姓名：</span>
            <input type="text" name="" id="">
        </p>
        <p>
            <span>执行方式：</span>

            <label for="test1">
                        手动：<input type="radio" name="test" id="test1">
                </label>
            <label for="test2">
                        自动：<input type="radio" name="test" id="test2">
                </label>
        </p>
        <input type="submit" value="提交">
    </form>
</body>

</html>

<script>
    // 阻止跳转
    var inp = document.querySelector('input');
    inp.addEventListener('click', function() {
        // 1.获取表单元素中的值
        // 2.ajax发送表单数据
        // 3.将响应回来的数据渲染到页面
    })
</script>
          撰写回答
          你尚未登录，登录后可以
          • 和开发者交流问题的细节
          • 关注并接收问题和回答的更新提醒
          • 参与内容的编辑和改进，让解决方法与时俱进
          推荐问题