在 $(function(){}中写了调用了一个函数,当页面加载完执行,查询出分页数据,第一次打开查询无条件,页码1,条数10,当用户填写查询条件后,点击查询按钮,再次调用查询函数,将参数传给查询函数
执行代码,发现在输入查询条件后点击查询,会发起请求查数据,但是在本次查完之后会再次执行页面加载后第一次查询的函数
<script type="text/javascript">
$(function(){
// 页面第一次打开调用查询函数,传参默认第一页,十条记录,无条件
// 这里的函数只希望在第一次加载页面的时候执行,但是当点击查询按钮,查询函数执行后会再次执行这里的函数
queryActivityConditionForPage(这里四个空的字符串(提交问题不让过-.-),1,10);
// 其他绑定单击事件函数代码
// 查询按钮绑定单击事件,点击查询收集数据,并调用函数执行查询
$("#queryActivitiesWithConditions").click(function (){
// 收集数据,验证数据合法
var name = $("#queryName").val();
var owner = $("#queryOwner").val();
var startDate = $("#queryStartDate").val();
var endDate = $("#queryEndDate").val();
if (startDate!=""&&endDate!=""){
if (endDate <= startDate){
alert("结束日期不能比开始日期小");
return;
}
}
queryActivityConditionForPage(name,owner,startDate,endDate,2,3);
alert('after')
// queryActivityConditionForPage(1,1,1,1,2,3);
// 发送请求
})
});
// 查询函数
function queryActivityConditionForPage(name,owner,startDate,endDate,pageNo,pageSize){
alert('method execute') // 这里弹窗显示函数被执行
$.ajax({
url: "workbench/activity/queryActivityConditionForPage.do",
type:"get",
data:{
"pageNo":pageNo,
"pageSize":pageSize,
"name":name,
"owner":owner,
"startDate":startDate,
"endDate":endDate
},
dataType: "json",
success:function (res){
$.each(res,function (index,element){
$("#activityList").append('<tr class="active">' +
'<td><input type="checkbox" /></td' +
'><td><a style="text-decoration: none; cursor: pointer;" >'+element.name+'</a></td>' +
'<td>'+element.owner+'</td><td>'+element.startDate+'</td><td>'+element.endDate+'</td></tr>')
})
}
})
}
</script>
debug 以及弹窗测试显示在用户点击输入查询条件点击查询按钮后
分别执行了两次 queryActivityConditionForPage 函数
第一次函数中的参数为用户输入的查询参数
第二次的函数执行的是 页面加载完之后的函数
queryActivityConditionForPage(这里四个空的字符串(提交问题不让过-.-),1,10); ,这行代码又执行了一次
我的解答思路和尝试过的方法
原因没有找到,$(function(){} 这里的函数为什么会因为异步请求再次执行 ?
我想要达到的结果
当页面加载后,执行一次无条件查询函数
queryActivityConditionForPage(这里四个空的字符串(提交问题不让过-.-),1,10);
当用户输入查询条件后点击查询按钮,执行queryActivityConditionForPage("name","owner","start","end",1,10);
