首页蓝耳朵|小小蓝耳朵广州图书馆外文室英语儿童读物资源介绍网佛教青年之友旧版收集永硕E盘Phonics Short Vowels Game 
input+select输入汉字或拼音快速选择数据第7步 完结
所属栏目:ASP.NET(webform)  时间:2010-12-06 17:37  作者:狼子

第6步里剩下的两个问题,现在全部解决了,拼音的解决见:http://www.nnllok.cn/Read.aspx?id=474

这里简单说一下第2个问题的解决:

2.还是select的选择问题,如果只是单击鼠标选择一项,没问题,就是,如果想要用鼠标拉着select的滚动条往后浏览数据后再选择,鼠标只要一点到select,我就默认选择第一项了。。。我不知道怎么判断鼠标点在选项上还是点在滚动条上,如果我在最开始不设置默认选项,这里可以利用selectedIndex属性吗?

我没有取鼠标点在select控件的哪里,我取不到,所以我用了一个数组wordLastSelectValue记录每一个input控件对应的select会显示的最后value值

在phonics.js里,每一次设置了wordValueArray[nowInputIndex].value的值后,我就把这个值同时设置给wordLastSelectValue[nowInputIndex]

在SetInputValue方法里,判断改为下面的

if(wordSelectObj.selectedIndex != -1 && wordSelectObj.value != wordLastSelectValue[nowInputIndex])

就是,如果存在选中项,然后呢,这个选中项的值,和原来的选中项的值是一样子的,就说明当前的select是点击在滚动条上的,是不需要设置input的值,也不需要隐藏控件的

还有就是,我修改了这个控件的SetOption方法,本来在input的值为""时,我是不显示select的任何项的,现在我改为当input值为""时,显示所有项,这样子用户可以直接从select里选择,不一定必须录入才可以选择,操作会更方便

这个控件到这里结束。。。

我想过用input + div模拟,想一下,觉的借select会更方便,就是,如果是用input + div模拟,各种效果都会更漂亮。。。

---------------------------------------

16:51 2010/12/7

phonics.js的ShowSelect方法,显示div时,top值需要加上滚动条的高度:

function ShowSelect(obj)
{
    //取当前input座标
    var oRect = obj.getBoundingClientRect();
    var x, y, scrollTop;
    x = oRect.left;
    y = oRect.top + 24;
    scrollTop = document.body.scrollTop;
   
    //重置select座标
    wordSelectDivObj.style.left = x + "px";
    wordSelectDivObj.style.top = eval(y + scrollTop) + "px";
   
    //重置选项
    SetOption(obj.value);
   
    //显示select
    if(wordSelectDivObj.style.display == "none") wordSelectDivObj.style.display = "block";
}

小楼宝宝的涂鸦花花(Imitater)的博客起名称骨测字皖ICP备06000023号-17