欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS實現很酷的EMAIL地址添加功能實例

 更新時間:2015年02月28日 09:43:05   作者:代碼家園  
這篇文章主要介紹了JS實現很酷的EMAIL地址添加功能,實例分析了javascript操作text文本的技巧,具有一定參考借鑒價值,需要的朋友可以參考下

本文實例講述了JS實現很酷的EMAIL地址添加功能的方法。分享給大家供大家參考。具體實現方法如下:

復制代碼 代碼如下:
<html>
<head>
<title>JS實現很酷的EMAIL地址添加功能</title>
<style type="text/css">
ul{ list-style:none; margin:0; padding:0;}
li{ margin:0; padding:0;}
#content{width:100%;}
#sendmail{float:left; width:60%;}
#friendlist{float:left; width:30%;}
#bxAddrFly{position:absolute;height:18px; width:46px;background:#EEE; border:1px #ccc solid;display:none;}
#tbAddrTree{ width:126px; float:left; padding:5px;border:1px #7F9DB9 solid;}
#tbAddrTree li{ width:100%; float:left;}
#tbAddrTree a{backgroud: #fff;width: 100%;color:#494949;text-decoration: none;float:left;}
#tbAddrTree a:hover{background: #e5edf6;}
</style>
<script type="text/javascript">
var ev={};
var flyDiv="bxAddrFly";
var inceptDiv="SendAddress";
var addEvent="addAddress()";
function oo(obj){return (document.getElementById) ? document.getElementById(obj): document.all[obj];}
function isNone(str){return str==null||str==""?true:false}
var Browser = new Object();
Browser.isFirefox = (navigator.userAgent.toLowerCase().indexOf("firefox")!=-1);
if (Browser.isFirefox) { extendEventObject();}
function extendEventObject() {
window.constructor.prototype.__defineGetter__("event", function(){
var o = arguments.callee.caller;
var e;
while(o != null){
e = o.arguments[0];
if(e && (e.constructor == Event || e.constructor == MouseEvent)) return e;
o = o.caller;
}
return null;
});

Event.prototype.__defineGetter__("srcElement", function () {
var node = this.target;
while (node.nodeType != 1) node = node.parentNode;
return node;
});
}
window.onload = function(){
var addrTree = oo('tbAddrTree');
addrTree.onmouseover = function(){addrTree_event(event)};
addrTree.onmouseout = function(){addrTree_event(event)};
addrTree.onclick = function(){addrTree_event(event)};
}
function addrTree_event(e){
var memberID,tr
var ee = e.srcElement;
if(ee.tagName=="A"&&e.type=="mouseover"){ee.style.textDecoration="underline"}
if(ee.tagName=="A"&&e.type=="mouseout"){ee.style.textDecoration=""}
if(e.type=="click"&&e.srcElement.tagName=="A"){
var li=ee.parentNode.parentNode;
ev.AddInfo="\""+li.getAttribute("memberName")+"\"<\""+li.getAttribute("email")+"\">"
oo(flyDiv).innerHTML=li.getAttribute("memberName");
addrTree_add(e.clientX,e.clientY)
}
}
function addrTree_add(ex,ey){
if(oo(flyDiv).style.display=='none'||oo(flyDiv).style.display==''){oo(flyDiv).style.display='block';}
var inceptE = oo(inceptDiv);
var inceptEX = inceptE.offsetTop;  
var inceptEY = inceptE.offsetLeft;  
while(inceptE = inceptE.offsetParent){
inceptEX += inceptE.offsetTop;  
inceptEY += inceptE.offsetLeft;  
}
ev.flyArr=new Array(ex,ey,inceptEX,inceptEY,10);
fly(flyDiv,addEvent);
}

function fly(flyObj,flyRun){
var obj,a=ev.flyArr,x,y
if(flyObj!=null){
if(ev.flyObj!=null){
window.clearTimeout(ev.flyTm);
ev.flyObj.style.top=-900;
}
a[5]=0;
ev.flyObj=oo(flyObj);
ev.flyRun=flyRun;
}

obj=ev.flyObj;
if(a[4]==null){a[4]=1}
a[5]+=a[4]/Math.sqrt(Math.pow(a[2]-a[0],2)+Math.pow(a[3]-a[1],2));
if(a[5]>1){
obj.style.top=-900;
eval(ev.flyRun);
ev.flyObj=null;
return;
}

window.clearTimeout(ev.flyTm);
x=(a[2]-a[0])*a[5]+a[0];
y=(a[3]-a[1])*a[5]+a[1];
obj.style.left=x;
obj.style.top=y;
document.body.style.overflowX="hidden";
ev.flyTm=window.setTimeout("fly()",10)
}

function addAddress()
{
var key=ev.AddInfo;
if (oo(inceptDiv).value.indexOf(key)==-1)
{
oo(inceptDiv).value+=key+",";
}
}
</script>
</head>
<body>
<div id="content">
  <div id="sendmail">
    <input name="textfield" type="text" id="SendAddress" size="70">
  </div>
  <div id="friendlist">
    <div id="tbAddrTree">
      <ul>
        <li membername="張三" email="zhangsan@163.com"><nobr><a>張三</a></nobr></li>
        <li membername="李四" email="lisi@1126.com"><nobr><a>李四</a></nobr></li>
        <li membername="王五" email="wangwu@189.com"><nobr><a>王五</a></nobr></li>
      </ul>
    </div>
    <div id="bxAddrFly"> </div>
  </div>
</div>
<br />
</body>
</html>

希望本文所述對大家的javascript程序設計有所幫助。

相關文章

  • js運動應用實例解析

    js運動應用實例解析

    這篇文章主要針對js運動應用進行實例解析
    2015-12-12
  • js實現網頁多級級聯(lián)菜單代碼

    js實現網頁多級級聯(lián)菜單代碼

    這篇文章主要介紹了js實現網頁多級級聯(lián)菜單代碼,涉及javascript基于數組動態(tài)構造多級級聯(lián)菜單的技巧,非常具有實用價值,需要的朋友可以參考下
    2015-08-08
  • php 修改密碼實現代碼

    php 修改密碼實現代碼

    這篇文章主要介紹了php 修改密碼實現代碼的相關資料,需要的朋友可以參考下
    2017-05-05
  • Js 正則表達式知識匯總

    Js 正則表達式知識匯總

    本文對javascript中正則表達式進行了總結匯總,將知識點和注意點都理了一下,并附上2個練習題,這里分享給小伙伴
    2014-12-12
  • BootStrap Fileinput上傳插件使用實例代碼

    BootStrap Fileinput上傳插件使用實例代碼

    這篇文章主要介紹了BootStrap Fileinput上傳插件使用實例代碼,,通過引入js和css文件,具體實現代碼大家參考下本文
    2017-07-07
  • Javascript獲取隨機數的實現方法

    Javascript獲取隨機數的實現方法

    下面小編就為大家?guī)硪黄狫avascript獲取隨機數的實現方法。小編覺得挺不錯的,現在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2016-06-06
  • JavaScript中string對象

    JavaScript中string對象

    和JAVA中String對象用處一樣啊,javascript中的String對象也有自己的方法,和JAVA中的類似。
    2015-06-06
  • bootstrap-treeview實現多級樹形菜單 后臺JSON格式如何組織?

    bootstrap-treeview實現多級樹形菜單 后臺JSON格式如何組織?

    這篇文章主要介紹了bootstrap-treeview實現多級樹形菜單,后臺JSON格式如何組織,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2019-07-07
  • JS簡單實現獲取元素的封裝操作示例

    JS簡單實現獲取元素的封裝操作示例

    這篇文章主要介紹了JS簡單實現獲取元素的封裝操作,結合實例形式分析了JS針對頁面ID、class、TAG元素獲取的函數與對象封裝操作實現方法,需要的朋友可以參考下
    2017-04-04
  • JS實現去除數組中重復json的方法示例

    JS實現去除數組中重復json的方法示例

    這篇文章主要介紹了JS實現去除數組中重復json的方法,涉及javascript針對json數組數據的遍歷、判斷、存取等相關操作技巧,需要的朋友可以參考下
    2017-12-12

最新評論