欢迎光临
我们一直在努力

下拉菜单支持输入,并根据输入内容自动定位

建站超值云服务器,限时71元/月

下拉菜单支持输入,并根据输入内容自动定位:

参考:演员发表于 10/23/2001 8:58:16 am 的文章 “罗亭的可输入下拉框的解密简化版.”,在此特别感谢相关人等。

本文为这个下拉框增加了一点小小的功能:输入能够定位在已有的选择框内。还有一个缺点,各位给改改:输入的时候不能够自动拉开选择框,怎么办?

function getleftpostion( theobj )
{
  var pos = 0;
  while ( theobj != null )
  {
    pos += theobj.offsetleft;
    //get the object which contain theobj.
    theobj = theobj.offsetparent;
  }
  return pos;
}
function gettoppostion( theobj )
{
  var pos = 0;
  while ( theobj != null )
  {
    pos += theobj.offsettop;
    //get the object which contain theobj.
    theobj = theobj.offsetparent;
  }
  return pos;
}
function checkversion()
{
  var isbadversion=true;
  var curver=navigator.appversion;
  var pos=parseint(curver.indexof("msie"));
  if (pos>=1)
  {
    var intver=parseint(curver.charat(pos+5));
    if (intver>=5)
    { isbadversion=false;}
  }
  if (isbadversion)
  {
    var msg="this page may not be displayed properly:\n"+
            " this product requires microsoft internet explorer 5 or later browser only.";
    alert(msg);
  }
}

//check the browser version
checkversion();

// the array of comboboies
thearray = new array();

function combobox(objid, objhandler)
{
    this.comobj = document.all[objid];
    this.comobj.selectedindex = -1;
    this.getvalue = getvalue;
    this.doresize = doresize;
    this.dochange = dochange;
    this.losefocus = losefocus;
    this.doselectidx = doselectidx;
    this.focus = focus;
    this.keypress = keypress;
    this.change = change;

    var strmsg="";

//——————————————————————————————————
// create the text object
//——————————————————————————————————
    var txtobjidname = objid + "_text";

    if (document.all[txtobjidname] != null)
    {
        strmsg="the following id: " + txtobjidname +" is used internally by the combo box!\r\n"+
           "use of this id in your page may cause malfunction. please use another id for your controls.";
        alert(strmsg);
    }

    var txtinner = "<input type=text id=" + txtobjidname + " name=" + txtobjidname + " onblur=" + objhandler + ".losefocus() " + " onkeyup=" + objhandler + ".keypress()" +  " onchange=" + objhandler + ".keypress()" + " style=display: none; position: absolute value= >";

    this.comobj.insertadjacenthtml("afterend", txtinner);

    this.txtobj = document.all[txtobjidname];

//——————————————————————————————————
// end
//——————————————————————————————————

    this.beresizing = false;
    this.doresize();
    thearray[thearray.length] = this;
}

function losefocus()
{
    var thecomobj = this.comobj;
    var thetxtobj = this.txtobj;
    var i;
    thecomobj.selectedindex = -1;

    if (thetxtobj.value == "")
    {
        return;
    }

    var optlen = thecomobj.options.length;
    for (i=0; i<optlen; i++)
    {
        var comval = thecomobj.options[i].text;
        var txtval = thetxtobj.value;

        if (comval == txtval)
        {
            thecomobj.selectedindex = i;
            return;
        }
    }
}

function doresize()
{
    if (!this.beresizing)
    {
        this.beresizing = true;
        this.txtobj.style.display="none";
        this.comobj.style.position="static";
        this.txtobj.style.posleft = getleftpostion(this.comobj);
        this.txtobj.style.postop = gettoppostion(this.comobj) + 1;
        this.txtobj.style.poswidth = this.comobj.offsetwidth – 16;
        this.txtobj.style.posheight = this.comobj.offsetheight;
        this.comobj.style.position ="absolute";
        this.comobj.style.posleft = this.txtobj.style.posleft;
        this.comobj.style.postop = this.txtobj.style.postop;
        this.offwidth = this.comobj.offsetwidth;
    
        var strrect = "rect(0 "+(this.comobj.offsetwidth)+" "+ this.comobj.offsetheight + " "+(this.txtobj.style.poswidth – 2 )+")";

        this.comobj.style.clip = strrect;
        this.txtobj.style.display="";
        this.beresizing = false;
    }
}

function dochange()
{
    var idx = this.comobj.selectedindex;
    var opt = this.comobj.options[idx];
    this.txtobj.value = opt.text;
    this.txtobj.focus();
    this.txtobj.select();
    this.comobj.selectedindex=-1;
}

function getvalue()
{
    return this.txtobj.value;
}

function doselectidx(i)
{
    var optlen = this.comobj.options.length;

    if ((i >=0) && (i < optlen))
    {
        this.comobj.selectedindex = i;
        this.txtobj.value = this.comobj.options[i].text;
        return;
    }
    this.txtobj.value = "";
}

function focus()
{
    this.txtobj.focus();
}

/*resize all combobox when window be resized*/
function resetallsize()
{
    var i;
    for (i=0; i < thearray.length; i++)
    {
        thearray[i].doresize();
    }
}
////////////////定位函数开始,我加的///////////////
function keypress()
{
    var txtstr;
    var comstr;
    var maxint = 0;
    var defint = 0;
    var defj;
    txtstr = this.txtobj.value;
    //document.form1.test.value=txtstr;
    var j;
    for(j=0;j<this.comobj.options.length;j++)
    {
        comstr = this.comobj.options[j].text;
        var m;
        for(m=0;m<txtstr.length+1;m++)
        {
            if(txtstr.charcodeat(m) != comstr.charcodeat(m))
            {
                maxint = m;
                break;
            }
        }
        if (defint < maxint)
        {
            defint = maxint;
            defj = j;
        }
    }
    this.comobj.selectedindex = defj;
}

赞(0)
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com 特别注意:本站所有转载文章言论不代表本站观点! 本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。未经允许不得转载:IDC资讯中心 » 下拉菜单支持输入,并根据输入内容自动定位
分享到: 更多 (0)

相关推荐

  • 暂无文章