当前位置:编程学习 > C#/ASP.NET >>

jquery 自动弹出层效果代码(1/2)

<script type="text/网页特效" src="网页特效/jquery/jquery.autocomplete.js"></script>

<link rel="stylesheet" type="text/css教程" href="js/jquery/jquery.autocomplete.css" />

<script type="text/javascript">

$().ready(function() {

    $("#level1name").autocomplete("levelautocompleteajaxaction.do");

    $("#level2name").autocomplete("levelautocompleteajaxaction.do");

    $("#level3name").autocomplete("levelautocompleteajaxaction.do");

});

</script>

<input type="text" id="level1name" />

<input type="text" id="level2name" />

<input type="text" id="level3name" />

使用时$("#level1name")为<input type="text" id="level1name" />中的id,

autocomplete("levelautocompleteajaxaction.do")为发送的url,ajax请求地址

几行代码,如此简单而已!

说明一下为了支持中文输入,需要修改jquery.autocomplete.js文件的几个地方,在文件的190多行左右,加上如下代码:

.bind("input", function() {

    // @hack by liqt:support for inputing  chinese characters  in firefox

    onchange(0, true);
    })


方法二自动弹出层

//显示listbox
function showlstbox()
{
    var txtbox = window.document.getelementbyid("textbox1");
    var lstbox = window.document.getelementbyid("listbox1");
    var strinput = txtbox.value;
    var arrmatch = new array();//用以匹配的字符串数组
    var strmatch; //匹配成功的字符串
    arrmatch = ["1111", "aaa", "klkk1", "akl1", "2222a", "ccc","南昌","南昌市高新区"];
    removeall("listbox1")
    for (var i = 0; i < arrmatch.length; i++)
    {
        strmatch = arrmatch[i];
        if (strmatch.indexof(strinput) >= 0)
        {
           
            var opt = document.createelement("option");
            opt.text = arrmatch[i].tostring();
            opt.value = arrmatch[i];
            lstbox.add(opt);
        }
    }
    if (lstbox.haschildnodes())
    {
        lstbox.style.display = "block"; //显示
    }
    else
    {
        lstbox.style.display = "none";//隐藏
    }       
}


//将id为listid的列表中的内容全部移除
function removeall(listid)
{
    var lst = window.document.getelementbyid(listid);
    var length = lst.options.length;
    for (var i = length; i > 0; i--)
    {
        lst.options[i - 1].parentnode.removechild(lst.options[i - 1]);
    }
}


//将listbox中选中项的内容复制到文本框中
function moveselect() {
    var txtbox = window.document.getelementbyid("textbox1");
    var lstbox = window.document.getelementbyid("listbox1");
    var length = lstbox.options.length;
    for (var i = 0; i < length; i++)
    {
        var lstindex = lstbox.selectedindex;
        if (lstindex < 0)
            return;
        txtbox.value = lstbox.options[lstindex].text;
    }
    //复制完成后隐藏listbox
    lstbox.style.display = "none";
}

1 2
补充:asp.net教程,.Net开发
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,