上传控件的按钮改为图片

因为控件虽然可以加CSS样式，但是还是无法将浏览按钮换成图片，尝试了隐藏控件然后用一图片按钮触发click事件，看起来还挺像回事，可是提交的时候都会把内容给清空了，原来这个控件存在安全机制问题，除了点击它的浏览按钮，不允许通过别的方式给它赋值。

尝试了好多方案，终于发现个能用的，经过修改提高，终于将BUG减到最小。原理是当鼠标移动到图片按钮上时触发JS，将上传控件悄悄的移到鼠标下方，这样点击时就是点击到控件的浏览按钮上了。

代码如下：

JS：

function moveMou()

{
    f = document.getElementById(fileupload0);
    f.style.pixelLeft=(event.offsetX-15);
    f.style.pixelTop=event.y+495;

}

页面：<img alt="上传附件" style="cursor: pointer;" src='<%=Page.ResolveClientUrl("~/NewImages/btn-ad.gif") %>' onmousemove="moveMou()"/>

代码解释：其中table的位置是为了初始化的时候input控件不要在屏幕范围内，这样就不会有人能误点点到了，filter:alpha(opacity=0);是使控件透明（这两点调试的时候可以先去掉）。pixelLeft和pixelTop的位置还需要具体根据情况调整，后面的参数换个页面就不一样了。因为我写的是多附件上传的控件，暂时还没发现换页面位置不一样的问题。font-size:1px;10px;和size='10'是为了修改控件的大小的，太大了误点的几率相对应就增加了。弄小些就是为了降低BUG的产生。

在之后的应用中，将母版页改为框架页以后，控件出现了点不到的情况，后来发现是纵坐标出现了问题。后经改进，现在的代码能适应这两种情况。代码如下：

function overMou(this)
{
    fn = uploadName + uploadNum;
    f = GetAttachElement(fn);
    f.style.pixelLeft=(event.offsetX-15);
    objP = this;
    allTop=0;
    while (objP!=null)
    {
        allTop   +=   objP.offsetTop;
        objP = objP.offsetParent;
    }
    f.style.pixelTop=allTop +event.offsetY + 495;

}

关于event后面的参数：

clientX
检索与窗口客户区域有关的鼠标光标的X坐标，属性为只读，没有默认值。
clientY
检索与窗口客户区域有关的鼠标光标的Y坐标，属性为只读，没有默认值。
ctrlKey
ctrlKey 检索CTRL键的当前状态
可能的值 true为关闭
false为不关闭
dataFld
检索被oncellchange事伯影响的列
aTransfer
为拖放操作提供预先定义的剪贴板式。
Element
检索在onmouseover和onmouseout事件期间退出的对象指针
keyCode
设置或检索与引发事件的关键字相关联的Unicode关键字代码
该属性与onkeydown onkeyup onkeypress一起使用
如果没有引发事件的关键字，则该值为0
offsetX
检索与触发事件的对象相关的鼠标位置的水平坐标
offsetY
检索与触发事件的对象相关的鼠标位置的垂直坐标
propertyName
检索在对象上己更改的特性的名称
reason
检索数据源对象数据传输的结果
可能的值：
0 数据传输成功
1 数据传输失败
2 数据传输错误
recordset
检索数据源对象中默认记录集的引用
该特性为只读
repeat
检索一个事件是否被重复
该属性只有在onkeydown事件重复时才返回true
returnValue
设置或检索从事件中返回的值
可能的值：
true 事件中的值被返回
false 源对象上事件的默认操作被取消
screenX
检索与用户屏相关的鼠标的水平位置
screenY
检索与用户屏相关的鼠标的垂直位置
shiftKey
检索shiftKey键的当前状态
可能的值 true为关闭
false为不关闭
srcElement
检索触发事件的对象
srcFilter
检索导致onfilterchange事件触发的过滤器对象
srcUm
检索触发事件行为的同一资源名称
除非下面两个条件都为真，否则该特性被设置为null
1.行为被附加到触发事件的要素上
2.在前面的项目符号中定义的行为己指定了一个URN标识符和己触发的事件
toElement
检索作为onmouseover或者onmouseout事件结果而移动的对象
type
检索事件对象中的事件名称
x
检索相对于父要素鼠标水平坐标的整数
y
检索相对于父要素鼠标垂直坐标的整数