jquery显示输入提示信息

1、JS部分

function mousePosition(ev){
    if(ev.pageX || ev.pageY){
     return {x:ev.pageX, y:ev.pageY};
     }
     return {
      x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
      y:ev.clientY + document.body.scrollTop  - document.body.clientTop
      };
}

function mouseMove(ev){
   ev = ev || window.event;
   var mousePos = mousePosition(ev);
   document.getElementById('xxx').value = mousePos.x;
 document.getElementById('yyy').value = mousePos.y;
}

document.onmousemove = mouseMove;
function seashowtip(id,flag,iwidth){
    var my_tips=$("#mytips");
    var tips;
    if($("#"+id).attr("datatype")=="normal"){
        tips="请输入"+$("#"+id).attr("min")+"个到"+$("#"+id).attr("max")+"个之间的字符";
    }else if($("#"+id).attr("datatype")=="number"){
        tips="请输入"+$("#"+id).attr("min")+"到"+$("#"+id).attr("max")+"位的数字";
    }else if($("#"+id).attr("datatype")=="floatdata"){
        tips="请输入有"+$("#"+id).attr("min")+"到"+$("#"+id).attr("max")+"位小数位小于1的小数";
    }
    if(flag){
        my_tips.html(tips);
        my_tips.css("display","");
        my_tips.css("width",iwidth);
              var  l=document.getElementById('xxx').value;
              var  t=document.getElementById('yyy').value;
              my_tips.css("left",l);
              my_tips.css("top",t);
       }
    else
    {
       my_tips.css("display","none");
       }
    }
 

 

2、页面部分

 

<div id=mytips style="position:absolute;background-color:#ffffff;width:121;height:16;border:1px solid gray;display:none;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=3); left:0; top:5"></div>
<input id="xxx" type="hidden" /><input id="yyy" type="hidden" />

<table width="600" border="0" cellpadding="0" cellspacing="1">
    <tr>
        <td>商品组名称:</td>
        <td><input type="text" max ="20" min ="5" datatype="normal" owntxt="商品组名称" ifnull="notnull" id="groupName" name="tpgDTO.groupName"
         class="text ui-widget-content ui-corner-all" style="width: 400px;" value="<s:property value="tpgDTO.groupName"/>" onmousemove="seashowtip('groupName',1,160)" onmouseout="seashowtip('groupName',0,160)"/>
        </td>
    </tr>
    <tr>
        <td>备注</td>
        <td><input type="text" max = "300" min = "3" datatype="normal" owntxt="备注" ifnull="cannull" id="remark" name="tpgDTO.remark"
        class="text ui-widget-content ui-corner-all" style="width: 400px;" value="<s:property value="tpgDTO.remark"/>" onmousemove="seashowtip('remark',1,160)" onmouseout="seashowtip('remark',0,160)"/>
        </td>
    </tr>
    <tr>
        <td>test浮点数:</td>
        <td><input type="text" max ="2" min ="1" datatype="floatdata" owntxt="浮点数" ifnull="cannull" id="testfloat"
         class="text ui-widget-content ui-corner-all" style="width: 400px;" onmousemove="seashowtip('testfloat',1,200)" onmouseout="seashowtip('testfloat',0,200)"/>
        </td>
    </tr>
    <tr>
        <td>test整数:</td>
        <td><input type="text" max ="8" min ="1" datatype="number" owntxt="整数" ifnull="cannull" id="number"
         class="text ui-widget-content ui-corner-all" style="width: 400px;" onmousemove="seashowtip('number',1,120)" onmouseout="seashowtip('number',0,120)"/>
        </td>
    </tr>
    <tr>
        <td>test比较大小前者:</td>
        <td><input type="text" max ="2" min ="1" datatype="floatdata" owntxt="毛利" ifnull="cannull" id="lower"
         class="text ui-widget-content ui-corner-all" style="width: 400px;" onmousemove="seashowtip('lower',1,200)" onmouseout="seashowtip('lower',0,200)"/>
        </td>
    </tr>
    <tr>
        <td>test比较大小后者:</td>
        <td><input type="text" max ="2" min ="1" datatype="floatdata" owntxt="毛利" ifnull="cannull" id="uper"
         class="text ui-widget-content ui-corner-all" style="width: 400px;" onmousemove="seashowtip('uper',1,200)" onmouseout="seashowtip('uper',0,200)"/>
        </td>
    </tr>
    <tr>
        <td>范围</td>
        <td><button id="show-filtercond-btn" style="font-size: 90%;">制定筛选条件</button></td>
    </tr>
</table>
 

不懂的联系QQ526151410

你可能感兴趣的:(jquery,UI,css,Microsoft)