日期:2014-05-17  浏览次数:20751 次

淘宝注册页面提示是怎么做的
比如淘宝注册页面 右边的提示 是怎么做的啊 我会用JQ 做 可是淘宝没有用jq啊 那他是怎么做的 根据什么原理做的啊
他提示都是在div里 我看到。。
除了jq谁还有其他方法吗 提示 出错 聚焦什么的,

------解决方案--------------------
他没用jq,可能用的是纯js啊。
------解决方案--------------------
1、肯定用到了ajax,在頁面源代碼可以看到:
HTML code

<script type="text/javascript">
                        function pageBeforeunload(evt,type)
               {
                var xhr;
                if(window.XMLHttpRequest)
                {
                    xhr = new XMLHttpRequest();
                }
                else
                {
                    try
                    {
                        xhr = new ActiveXObject('Microsoft.XMLHTTP');
                    }
                    catch(e){}
                }
                var start=document.getElementById("reg_st_id").value;
                var url="http://member1.taobao.com/member/statistics/register_statistic.do?t=1";
                url=url+"&s="+start+"&e="+new Date().getTime();
                xhr.open('GET', url, true);
                xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
                xhr.send();
            }
                        (function(){
                                window.onbeforeunload=pageBeforeunload; 
                                var v=document.createElement("input");
                v.setAttribute("id","reg_st_id");
                v.setAttribute("name","reg_st");
                v.setAttribute("type","hidden");
                v.setAttribute("value",new Date().getTime());
                //v.value=(new Date()).getTime();
                document.body.appendChild(v);
            })();
        </script>

------解决方案--------------------
我不知道它的源代码,不过我刚刚在项目中参照它的样式写过,纯js+div就能搞定
------解决方案--------------------
function checkpwd(){
var obj=$("#id1").value;
if(obj.length<6||obj.length>16){
$("#id2").innerHTML("不能小于6或大于16");
}else(
$("#id2").innerHTMl("插入的图片勾");
}
}
id1为输入密码框id
id2为后面的提示框id
------解决方案--------------------
你的服务端用什么框架?struts2 和webwork的验证框架都完美支持ajax,很好用。
------解决方案--------------------
js部分:
//验证旧密码是否正确
function validateOldPassword(){
var oldPass = document.getElementById("passForm:oldPass").value;
var opass = document.getElementById("passForm:opass").value;
var trip=document.getElementById("oldTrip");
if(oldPass!=opass && oldPass!=""){
//原密码输入不正确
trip.innerHTML="<img src='${request.contextPath}/baf/images/icons/error.png' style='vertical-align: middle'/>原密码输入不正确"; trip.style.display="inline";
document.getElementById("passForm:oldPass").value = "";
setFocus("passForm:oldPass");
return;
}
trip.style.display="none";
}

页面部分:
<tr>
<td class="column1">
<h:outputText value="#{msgs['oldPassword']}:"
transient="true" />
</td>
<td class="column2">
<input id="oldPass" value=""
style="width:100%;height:23px;"
class="rich-gradient-input"
onblur="validateOldPassword()"/>