如何在form.serialize中获取下拉值和文本？

使用ajax方式获取表单中下拉列表的数据并提交给服务器

HTML页面

<form id="form-add">
	<input type="text" value="" name="username">
	<input type="text" value="" name="password">
	<select id="gender">
		<option value="1" selected="selected">男option>
		<option value="2">女option>
	select>
form>

第一种方式： $("#form-add").serialize()

注意：$('#gender option:selected').text()，若要获取指定id的下拉列表，要加入#id。若下拉列表没有id名称，则不需要加入#，如$('select option:selected').text()。

//给提交按钮绑定单击事件
 $("#btn-add").click( function () {
     
     $.ajax({
     
            url: "/add", //请求url
            data: $("#form-add").serialize()+'&gender='+$('#gender option:selected').text(),
            method: "post", //请求方式
            dataType: "json", //响应数据的类型
            success: function (result) {
      //服务器成功返回时，执行的匿名函数
                if (result.state == 2000) {
     
                    alert("添加成功！");
                    location.href = "index.html"; //跳转到首页
                } else {
     
                    alert(result.message);
                }
            }
        });
    });

第二种方式：$("#form-add").serializeArray()
简单写一下不同点。

var data = $('#form-add').serializeArray();
data.push({
      
  name: 'gender',
  value: $('#gender option:selected').text() 
});