pixynj
2016-10-11 08:17
采纳率: 80%
浏览 4.7k
已采纳

jsp ajax 无刷新提交form表单,并返回结果在当前页面?怎么做,求具体的demo

jsp 页面多个div 其中一个如下

 <div id="a">
 <form>
     <input type="text" name="username"/>
     <input type="submit" value="查询" />
 </form>
 <div>
 <!-- 此处显示提交后后台返回来的数据-->
 </div>
</div>

如何提交这个form表单到后台 ,当前页面其他的div不动,返回的结果在当前页面
ajax或者js如何写
!一定要提交表单不刷新其他部分,最后类似贴吧回复的效果,输入后,直接在下面显示

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

7条回答 默认 最新

  • 阮二 2016-10-12 02:49
    已采纳

    我知道你的意思了 ,
    1:你不要用submit这个标签 用 然后自己写onclick事件
    2:在onclick事件里获取表单的数据 通过ajax传到后台
    3:ajax获取到后台传回的数据 append到div中

    因为 你用submit就是为自动刷新的

    点赞 2 打赏 评论
  • qq_21873571 2016-10-11 08:22

    submit 用其他的代替把,
    $.ajax({
    type: "POST",
    url: "路径",
    data: "username=John",
    success: function(msg){
    //返回回来的值
    }
    });

    点赞 打赏 评论
  •  <div id="a">
    
            <input type="text" id="username" />
            <input type="submit" value="查询" onclick="doSearch()" />
    
        <div id="result">
            <!-- 此处显示提交后后台返回来的数据-->
        </div>
    </div>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
    <script>
        function doSearch() {
            var v = $('#username').val();
            if (v != '') {
                //xxxxx.jsp获取username参数(POST)提交的,然后返回查询结果的html代码就行,不要返回html,body,head之类的标签,可能导致浏览器解析出错
                $('#result').load('xxxxx.jsp', {username:v});
            }
        }
    </script>
    
    点赞 打赏 评论
  • qq_21873571 2016-10-11 08:40

    图片说明大概就是这个意思

    点赞 打赏 评论
  • jzh861752408 2016-10-11 09:27

    ajax 请求成功以后 追加到div里面就可以了

    点赞 打赏 评论
  • effiu 2016-10-12 03:30
     $.ajax({
            url:"",
            dataType:"",
            type:""
            data:$("#formId").serialize(),
            success:function(data){},
            error:function(data){}
    })
    
    

    $("#formId").serialize(),会对form表单的数据进行封装

    点赞 打赏 评论
  • 情人节也放假 2016-10-12 09:44

    给具体按钮或者页面元素添加onclick事件,触发ajax请求所在的方法,不要进行form的submit触发

    点赞 打赏 评论

相关推荐 更多相似问题