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();
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。