自己写的一个数字选择器,但又以下问题望各位帮忙解决
1)弹出层始终在下方,这样可能下方挡住了,我想让其随浏览器高度来定
2)弹出层被select挡住了,如何让其在最上层
3)除选择数字外,也可以输入指定范围的数字,这样需要判断用户输入是否合法,我是单独使用了onblur,感觉有点臃肿,能否直接在setnum中实现输入判断?或者有无其他更好办法?
4)以下弹出层始终是4*5的格子,能否根据总的数字数量来动态设置弹出层大小?
<html>
<title></title
<head>
</head><body>
<form action="" method="get" name="form1" id="form1">
<input type="text" name="nubtxt1" onfocus="setnum(this,document.form1.nubtxt1,0,5)"  onblur="valinum(this,document.form1.nubtxt1,0,5)">
<input type="text" name="nubtxt2" onfocus="setnum(this,document.form1.nubtxt2,0,10)" onblur="valinum(this,document.form1.nubtxt2,0,10)">
<input type="text" name="nubtxt3" onfocus="setnum(this,document.form1.nubtxt3,0,12)" onblur="valinum(this,document.form1.nubtxt3,0,12)">
<br>
<select></select>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><input type="text" name="nubtxt4" onfocus="setnum(this,document.form1.nubtxt4,0,12)" onblur="valinum(this,document.form1.nubtxt4,0,12)"></form>
<script language="javascript">
document.writeln('<div id="numLayer" style="position: absolute; width: 142; height: 166; z-index: 9998; display: none">');
document.writeln('<table border="1" cellspacing="1" cellpadding="1" width="100" height="100" bgcolor="#FFFFFF">');
var n = 0;
for (j = 0; j < 4; j++)
{
  document.writeln('<tr align="center">');
  for (i = 0; i < 5; i++)
  {
    document.writeln('<td width="20" height="20" id="MJBNum' + n + '" style="font-size:12px" Author="MJB" onclick="numClick(this.innerText)" align="center"></td>');
    n++;
  }
  document.writeln('</tr>');
}
document.writeln('</table>');
document.writeln('</div>');var outObject;
var MJBWNum = new Array(20); //定义写数字的数组  
function setnum(tt, obj, xmin, ymax) //主调函数
{
  if (arguments.length > 4)
  {
    alert("对不起!传入本控件的参数太多!");
    return ;
  }
  if (arguments.length == 0)
  {
    alert("对不起!您没有传回本控件任何参数!");
    return ;
  }
  var dads = document.all.numLayer.style;
  var th = tt;
  var ttop = tt.offsetTop; //TT控件的定位点高
  var thei = tt.clientHeight; //TT控件本身的高
  var tleft = tt.offsetLeft; //TT控件的定位点宽
  var ttyp = tt.type; //TT控件的类型
  while (tt = tt.offsetParent)
  {
    ttop += tt.offsetTop;
    tleft += tt.offsetLeft;
  }
  dads.top = (ttyp == "image") ? ttop + thei: ttop + thei;
  dads.left = tleft;
  outObject = (arguments.length == 1) ? th : obj;
  dads.display = '';
  event.returnValue = false;
  MJBSetNum(xmin, ymax);
}function numClick(n)
{
  if (outObject)
  {
    if (!n)
    {
      //outObject.value = "";
      return ;
    }
    outObject.value = n;
    closeLayer();
  }
  else
  {
    closeLayer();
    alert("您所要输出的控件对象并不存在!");
  }
}function closeLayer() //这个层的关闭
{
  document.all.numLayer.style.display = "none";
}function MJBSetNum(x, y) //主要的写程序**********
{
for (var i = 0; i < 20; i++)
 {MJBWNum[i]="";
  var da = eval("document.all.MJBNum" + i);
  da.innerHTML = "";
  da.style.backgroundColor = "#FFFFFF";
 }//将显示框的内容全部清空
 
  for (var i = x; i < y + 1; i++)
  {
    MJBWNum[i] = i;
  }
  for (var i = x; i < y + 1; i++)
  {
    var da = eval("document.all.MJBNum" + i);
    da.innerHTML = "<b>" + MJBWNum[i] + "</b>";
    //alert(da.innerHTML);
    da.style.backgroundColor = (outObject.value == MJBWNum[i] && outObject.value != "") ? "#FFD700" : "#ADD8E6";
    da.style.cursor = "hand"
  }
}function document.onclick() //任意点击时关闭该控件
{
  with(window.event.srcElement)
  {
    if (getAttribute("Author") == null && tagName != "INPUT" && tagName != 
      "IMG")
      document.all.numLayer.style.display = "none";
  }
}function isNumber(s)
{
  var regu = "^[0-9]+$";
  var re = new RegExp(regu);
  if (s.search(re) !=  - 1)
  {
    return true;
  }
  else
  {
    return false;
  }
}function valinum(tt, obj, xmin, ymax)
{
  if (obj.value != "")
  {
    if (!isNumber(obj.value) || obj.value < xmin || obj.value > ymax)
    {
      alert("请输入或选择"+xmin+"-"+ymax+"之间的数字!");
      obj.value = "";
      obj.focus();
    }
  }
}
</script>
</body>
</html>