HTML
<form action=""class="formBox"> <input type="text" placeholder="YOUR NAME"> <input type="text" placeholder="YOUR MAIL"> <textarea name="" id="" placeholder="YOUR MESSAGE"></textarea> <input type="submit" value="Submit your email" class="tjBtn"></form>
jQuery
var common = { baseSize: 100, init: function () { let that = this; that.bindSubmitBtn(); }, bindSubmitBtn: function () { $(document).ready(function () { $($("input.tjBtn")[0]).bind("click", function () { // alert("Hello World bind"); // $("form.formBox").attr("action", "#"); $('form.formBox').submit((e) => { e.preventDefault(); }) //获取第一个input var userNmae = $($($("form.formBox")[0]).find("input")[0]).val(); //获取第二个input var userEmail = $($($("form.formBox")[0]).find("input")[1]).val(); //获取第一个textarea var usermsg = $($($("form.formBox")[0]).find("textarea")[0]).val(); //自定义参数名 var param = { name: userNmae, email: userEmail, message: usermsg }; // 用户名验证 if (userNmae == null || userNmae == "") { alert("用户名不能为空"); return false; } else if (userNmae.length < 5 || userNmae.length > 20) { alert("用户名长度必须介于5-20个字符之间!"); return false; } var atpos = userEmail.indexOf("@"); var dotpos = userEmail.lastIndexOf("."); // 邮箱验证 if (userEmail == "") { alert("邮箱不能为空"); return false; } else if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= userEmail.length) { alert("不是一个无效的 e-mail 地址"); return false; } // 信息验证 if (usermsg == "") { alert("信息不能为空"); return false; } //提交表单 $.ajax({ type: "POST", url: "https://api.trade.org/live/userinfo", //传参param data: param, dataType: "json", success: function (respMsg) { msgpop(respMsg.msg , 3000) } }); // return false; }); }); },};/** *增加提醒弹框 * msg 提醒音讯文案 * time 提醒音讯弹窗显示时长(单位毫秒) */ function msgpop(msg,time) { $(".popup2").after(` <div class='popup3'> <div>${msg}</div> </div> `); setTimeout(function () { $('.popup3').remove(); },time||5000)}common.init();