常用的大概有ajax,jquery,layui,onclick,submit几种方式
<button id="submit_btn" class="layui-btn layui-btn-sm" >保存合同</button> <!--jquery+ajax方式-->
<button class="layui-btn layui-btn-sm" lay-submit lay-filter="go" >保存合同</button> <!--layui+ajax方式-->
1.jquery+ajax
工作中最常用的方式 $("#submit_btn").on(events,[selector],[data],fn)
$("#submit_btn").on('click',function(){
$.ajax({
type: "POST", //提交方式
url: '${base }/contractother/savecontractother.htm?updateType=${updateType}', //后台保存的方法代码
data: $("#contractOtherForm").serialize(), //表单的数据
error:function(){
alert("请求失败...");
$("#contractOtherForm").unmask();//遮罩
},
success: function(msg){
if(msg!='error'){
alert("保存成功");
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭
window.parent.location.reload('tableIns'); //加载父页面的方法
}else{
alert("操作失败,请稍候再试!");
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭
window.parent.location.reload('tableIns');
}
$("#contractOtherForm").unmask();
}
});
return false;
});
2.layui+ajax
form.on('submit(go)', function(data){
$.ajax({
type: "POST", //提交方式
url: '${base }/contractother/savecontractother.htm?updateType=${updateType}', //后台保存的方法代码
data: $("#contractOtherForm").serialize(), //表单的数据
error:function(){
alert("请求失败...");
$("#contractOtherForm").unmask();//遮罩
},
success: function(msg){
if(msg!='error'){
alert("保存成功");
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭
window.parent.location.reload('tableIns'); //加载父页面的方法
}else{
alert("操作失败,请稍候再试!");
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭
window.parent.location.reload('tableIns');
}
$("#contractOtherForm").unmask();
}
});
return false;
});
3.onclick
<img src="../1.jpg" alt="图片" οnclick="mouse()"/>
<script type="text/javascript">
function mouse(){
alert('我是一张图片!!!');
}
</script>
4.sumbit
<form id="form_test" action="" method="post">
用户名:<input type="text" value="" id="username"/>
密 码:<input type="text" value="" id="password"/>
<button id="submit_btn">submit</button>
</form>
<script type="text/javascript">
form_test.onsubmit = function(e) {
e.preventDefault();
console.log('form_test')
}
submit_btn.onclick = function(e) {
// e.preventDefault();
console.log('submit_btn')
}
</script>
还有传统的js方式,不常用就不写了