近来瞎做一个会议时间的选择页面,
点选开始时间和结束时间的时候,怎么感觉有时候判断是好的,有时候判断又不正确
比如alert((startTimeId<=id)+"---startTimeId:"+startTimeId+"objId:"+objId);返回的结果有时候竟然是:true--startTImeId:11 objId:9的情况。如果可以,大家可以把这个jsp运行一下
逻辑是:首次点击(onClick),默认是开始时间,再次点击为结束时间,第三次右边点击为修改结束时间,第三次左边点击为修改开始时间我操作了一下,先点击一下,如:11,再右边点击一下:13,再左边点击一下:9   ——正常应该清除所有,选中9为开始时间,但是点击了没反应。
jsp页面代码如下<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<style type="text/css">
table{border:1px solid #77a594;border-collapse:collapse;width: 95%;}
td{border:1px solid #77a594;empty-cells:show;width:30px; height:50px; text-align:center;}
</style>
<script type="text/javascript">
/**全局常量,设置鼠标移至(onmouseover)状态时td的背景颜色*/
var MOUSEOVERCOLOR = "#EEEEEE";
/**全局常量,设置鼠标移出(onmouseout)状态时td的背景颜色*/
var MOUSEOUTCOLOR = "#FFFFFF";
/**全局常量,设置鼠标按下(onmousedown)状态时td的背景颜色*/
var MOSECLICKCOLOR = "#00f";

/**全局变量,设置选中开始时间的ID*/
var startTimeId = -1;
/**全局变量,设置选中结束时间的ID*/
var endTimeId = -1;
function select(obj,isSelect){
if(startTimeId>=0){
return ;//如果已选择开始时间,则鼠标移至(onmouseover)状态,鼠标移出(onmouseout)状态无效
}
if(isSelect){
obj.style.background=MOUSEOVERCOLOR;//设置鼠标移至(onmouseover)状态时td的背景颜色
}else{
obj.style.background=MOUSEOUTCOLOR;//设置鼠标移出(onmouseout)状态时td的背景颜色
}
}
var objId = -1;
function checkSelect(id){
objId = id;
if(startTimeId<0){
//第一次选择开始时间
startTimeId = objId;
endTimeId = objId;
document.getElementById(objId).style.background=MOSECLICKCOLOR;
document.getElementById("div1").innerHTML="startTimeId:"+startTimeId+"endTimeId:"+endTimeId+"objid:"+objId;
}else{
//选择过
//alert((startTimeId<=id)+"---startTimeId:"+startTimeId+"objId:"+objId);
if(startTimeId<=objId){
//点击右边
if(endTimeId<objId){
//选中后的右边
endTimeId = objId;
var j = startTimeId;
for(j+1;j<=endTimeId;j++){
document.getElementById(j).style.background = MOSECLICKCOLOR;//设置选中状态
}
document.getElementById("div2").innerHTML="startTimeId:"+startTimeId+"endTimeId:"+endTimeId+"objid:"+objId;
}else{
//选中后的左边
var i = startTimeId;
for(i+1;i<=endTimeId ;i++){
document.getElementById(i).style.background = MOUSEOUTCOLOR;//清除选中状态
}
endTimeId = objId;
var j = startTimeId;
for(j+1;j<=endTimeId;j++){
document.getElementById(j).style.background = MOSECLICKCOLOR;//设置选中状态
}
document.getElementById("div3").innerHTML="startTimeId:"+startTimeId+"endTimeId:"+endTimeId+"objid:"+objId;
}
}else{
//点击左边,左边结束时间小于开始时间,默认回到未选择状态,重新选择开始时间
if(startTimeId>=endTimeId){
document.getElementById(startTimeId).style.background = MOUSEOUTCOLOR;//清除选中状态
}else{
var i = startTimeId;
for(i;i<=endTimeId ;i++){
document.getElementById(i).style.background = MOUSEOUTCOLOR;//清除选中状态
}
}
document.getElementById("div4").innerHTML="startTimeId:"+startTimeId+"endTimeId:"+endTimeId+"objid:"+objId;
//重新选择开始时间
document.getElementById(objId).style.background=MOSECLICKCOLOR;
startTimeId = objId;
endTimeId = objId;
document.getElementById("div5").innerHTML="startTimeId:"+startTimeId+"endTimeId:"+endTimeId+"objid:"+objId;
}
}
}
</script>
  </head>
  
  <body>
    <table id="table" border="1"  cellpadding='1' cellspacing='1'>
<tr>
<%
    for(int i=0;i<24*4;i++){
    %>
    <td id="<%=i%>" onmouseover="select(this,true)" onmouseout="select(this,false)" onClick="checkSelect('<%=i%>')"><%=i %></td>
    <%
    }
    %>
    </tr>
    <tr>
    <%
    for(int i=0;i<24;i++){
    %>
    <td><%=i%>:00</td>
    <td><%=i%>:15</td>
    <td><%=i%>:30</td>
    <td><%=i%>:45</td>
    <%
    }
    %>
    </tr>
</table>
    div1:<div id = "div1"></div><br/>
    div2:<div id = "div2"></div><br/>
    div3:<div id = "div3"></div><br/>
    div4:<div id = "div4"></div><br/>
    div5:<div id = "div5"></div><br/>
  </body>
</html>

解决方案 »

  1.   

    我顶,怎么都是打粮油的,可以直接给jsp保存下就可以运行下了撒,帮我看看,我感觉没问题啊,郁闷,邪了B了
      

  2.   

    不是很明白楼主的意思。不过我在以前碰到过类似js比较的问题:就是当两个变量比较大小的时候,会出现一些问题。因为js变量是弱类型,所有的变量都是通过var来声明的,比较大小时默认的是比较字符串,如果相比较整数大小的话,应该强制转换成“int类型”,通过调用parseInt(str)方法。
    楼主可以试试!