参考网络代码基础上进行修改,调试通过。

在html中插入下面的代码:

函数ajaxSubmit是submit的ajax形式。

注意:这里面使用到了jquery库

            //<!--将form中的值转换为键值对。-->
function getFormJson(frm) {
var o = {};
var a = $(frm).serializeArray();
$.each(a, function () {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
}); return o;
} //<!--将form转为AJAX提交。-->        
       //<!--fn为返回后的回调函数,可以为空-->
function ajaxSubmit(frm, fn) {
var dataPara = getFormJson(frm);
var ajax_para={};
ajax_para['data']=dataPara;
if (!frm.attr('action') ){
ajax_para['url']=this.location.pathname;
}
else{
ajax_para['url']=frm.attr('action');
}
ajax_para['type']=frm.attr('method');
if (!frm.attr('method')){
ajax_para['type']='GET';
} if (fn) {
ajax_para['success']=fn;
}
htmlobj=$.ajax(ajax_para);
return htmlobj;
}

在form提交时候调用该插件

将form中submit按钮修改成

<button type="button" class="btn btn-default" onclick="ajaxSubmit($('form'))">submit</button>

将form转为ajax提交的js代码的更多相关文章

  1. ajax同步请求JS代码

    ajax同步请求JS代码 <script type="text/javascript"> var txt = document.getElementById('txt' ...

  2. js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  3. Form表单提交,js验证

    Form表单提交,js验证 1,  Onclick() 2, Onsubmit() Button标签 input (属性 submit  button )标签 Input type=button    ...

  4. jsp不通过form和Ajax提交

    在页面里面我们一般都通过form表单和Ajax向后台提交请求,但是我如今页面没有form表单,也不想通过ajax异步提交. 解决方式例如以下:location.href="${rootPat ...

  5. Ajax注册验证js代码

    分享jquery网站:http://www.css88.com/jqapi-1.9/focusout/ $(document).ready(function() { var bool_user = f ...

  6. ajax提交的javascript代码

    var xhr=xhr(); function xhr(){ if(window.XMLHttpRequest){ return   window.XMLHttpRequest(); }else if ...

  7. ajax提交Form

    Jquery的$.ajax方法可以实现ajax调用,要设置url,post,参数等. 如果要提交现有Form需要写很多代码,何不直接将Form的提交直接转移到ajax中呢. 以前的处理方法 如Form ...

  8. 序列化layer创建的弹出表单并ajax提交

    /** *createTime:2015-09-13 *updateTime:2015-09-13 *author:刘俊 *phone:13469119119 *QQ:418873053 **/ va ...

  9. MVC中用ajax提交json对象数组

    应用场景:在前端用ajax向服务器提交json对象数组,在controller的以对象数组作为函数的参数,提交的json数组直接转为服务器端的对象数组. 如: 要将json对象数组[{Id:1,Nam ...

随机推荐

  1. export LD_LIBRARY_PATH 的使用

    对linux不是很熟,之前只是听说过可以设置程序共享库位置也就是 使用 “export LD_LIBRARY_PATH” 今天用了用,感觉还挺不错,也很常用. 比如你编译了一个so 而这个so 同时又 ...

  2. 一篇文章让你了解并掌握memcached

    第一章 memcached简介 1.1为什么引入memcached 随着数据量的增大,访问的集中,REBMS负担加重,数据库响应恶化. Memcached是高性能的分布式内存缓存服务器,目的是通过缓存 ...

  3. oracle 11g 32&64位导出 导入到Oracle10g 32位

    想导入一个oracle11g的数据库到自己本地电脑上,直接exp导出的话拿到自己电脑上提示错误, 于是在网上找方法 方法如下 : 一.在11g服务器上,使用expdp命令备份数据 11g 导出语句:E ...

  4. 10-编译PHP并与nginx整合

    nginx的URL重写.nginx+PHP的配置也是不可不学的部分.PHP自己手动编译,mysql就自己yum了. yum install 安装mysql 同时进行php的编译,手动编译php 这么多 ...

  5. c# 常规验证基类

    using System;using System.Collections.Generic;using System.Linq;using System.Text.RegularExpressions ...

  6. 自定义JTabbedPane 标签风格

    自定义JTabbedPane 标签风格 2012年03月09日 20:33:12 阅读数:2435 demo 下载地址:http://download.csdn.net/detail/jinannan ...

  7. 浅谈Android内存管理

    最近在网上看了不少Android内存管理方面的博文,但是文章大多都是就单个方面去介绍内存管理,没有能全局把握,缺乏系统性阐述,而且有些观点有误,仅仅知道这些,还是无法从整体上理解内存管理,对培养系统优 ...

  8. 关于Pascal(帕斯卡)以及Camel(驼峰)命名法

    小驼峰式命名法(lower camel case): 第一个单字以小写字母开始:第二个单字的首字母大写,例如:firstName.lastName,也被称为Camel命名法. 大驼峰式命名法(uppe ...

  9. Adorner的收集

    Adorners Overview https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/adorners-overview ' ...

  10. 挂载ISO 和 KILL 掉占用进程

    mount -t iso9660 -o loop,user VMware-tools-linux-8.6.0-425873.iso /mnt/cdrom fuser -m -v -i -k  /mnt ...