JQuery获取form表单数据

男娘i 2022-05-09 04:10 1083阅读 0赞

1.首先页面的form的所有表单元素需要增加name属性

<div class="form-group">
        <label for="name" class="col-md-2 control-label">数据源名称：</label>
        <div class="col-md-8">
             <input type="text" class="form-control" placeholder="请输入数据源名称" name="name" id="name" title="数据源名称" required/>
        </div>
    </div>
    <div class="form-group">
    	<label for="type" class="col-md-2 control-label">数据库类型：</label>
    	<div class="col-md-8">
    	<select class="form-control" name="type" id="type" title="数据库类型">
    		<option value="1" selected>Mysql</option>
    		<option value="2">Oracle</option>
    	</select>
    </div>

2.获取表单数据的方式一：

let json = $('#addDataSourceForm').serialize();
    console.log('json : ',json); // 输出：name=asd&type=1

3.获取表单数据的方式二：

let data = {};
    let value = $('#addDataSourceForm').serializeArray();
    $.each(value, function (index, item) {
                data[item.name] = item.value;
            });
    let json = JSON.stringify(data);
    console.log('json : ',json);
    /*
    * 输出：{"name":"asd","type":"1"}
    */

根据自己需要的格式选择吧。

发表评论取消回复

表情：

评论列表（有 0 条评论，1083人围观）

还没有评论，来说两句吧...

相关阅读

相关 Javaweb —— Servlet获取form表单数据（参数）

Servlet获取form表单数据（参数） **获取请求参数** 在实际开发中，经常需要获取用户提交的表单数据，例如用户名和密码等，为了方便获取表单中的请求参数，...

野性酷女/ 2024年04月19日 09:53/ 0 赞/ 75 阅读

相关 Java servlet获取form表单数据（参数）

本节主要讲在 Servlet 中如何使用 HttpServletRequest 获取请求参数和 request 对象传递数据有哪些方法。获取请求参数在实际开发中，经

素颜马尾好姑娘i/ 2024年03月29日 15:13/ 0 赞/ 93 阅读

相关 antd获取/更改form表单数据（表单域数据）

创建ref引用 formRef = React.createRef(); 表单和ref绑定 //ref={this.formRef} 先给For

今天药忘吃喽~/ 2024年02月21日 10:08/ 0 赞/ 74 阅读

相关 jQuery提交form表单

<form id="search_form" name="search_form" method="post"> <input type="tex

「爱情、让人受尽委屈。」/ 2022年08月02日 09:44/ 0 赞/ 346 阅读

相关 jQuery中设置form表单

<form id="myFormId" name="myForm" action="" method="post"> <input type="text"

Myth丶恋晨/ 2022年06月17日 14:23/ 0 赞/ 291 阅读

相关 Ajax获取form表单提交数据

<!DOCTYPE html > < html lang= "en" > < head > < meta charset= "UTF-8" > < meta na

本是古典何须时尚/ 2022年06月16日 12:27/ 0 赞/ 426 阅读

相关 jQuery插件：表单jquery.form.js

jQuery插件：表单jquery.form.js jQuery插件：表单jquery.form.js [jquery.form.js 官网][jquery.fo

矫情吗；*/ 2022年06月01日 03:27/ 0 赞/ 258 阅读

相关 JQuery获取form表单数据

1.首先页面的form的所有表单元素需要增加name属性 <div class="form-group"> <label for="name" cla

男娘i/ 2022年05月09日 04:10/ 0 赞/ 1084 阅读

相关 Java servlet获取form表单数据（参数）

获取请求参数在实际开发中，经常需要获取用户提交的表单数据，例如用户名和密码等，为了方便获取表单中的请求参数，在 HttpServletRequest 接口的父类 Ser...

朱雀/ 2021年01月13日 09:31/ 0 赞/ 2072 阅读

相关如何利用js获取form表单数据

如何利用js获取form表单数据方法如下： 1、有的时候想偷点懒，页面上有大量的表单提交数据，每次单独获取都比较麻烦。代码冗余度也比较多，因此封装了一个方法。 2、表单...

灰太狼/ 2020年06月07日 15:58/ 0 赞/ 947 阅读