html 浮动窗口

最新推荐文章于 2025-06-11 14:20:46 发布

原创最新推荐文章于 2025-06-11 14:20:46 发布 · 2.5k 阅读

0 ·

CC 4.0 BY-SA版权

xhtml 专栏收录该内容

50 篇文章

订阅专栏

本文详细探讨了HTML中实现浮动窗口的技术，包括如何使用CSS定位、JavaScript交互以及常见问题的解决策略，帮助开发者创建出响应式的浮动窗口效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

		<input type="text" size="84" id="receiver"/>
		<input type="button" value="批量输入" onclick="createInputDialog(this,'1','')" name="riskbehavior"/>

function createInputDialog(obj,id,value)
{  
    var div=document.getElementById("editBehaviorDiv");  
    if(div!=null)  
        document.body.removeChild(div);  
    div = document.createElement("div");   
    div.id="editBehaviorDiv";  
    div.style.position='absolute';  
    var op=getoffset(obj); 
    div.style.top= "100px";  
    div.style.left= (document.body.clientWidth - 374)/2.0 + "px";  
    div.style.zIndex =100;  
    div.style.backgroundColor='#ecf1f6';  
    div.style.border="1px solid #666";  
    //div.className="td1";  
    div.innerHTML="<textarea name='behaviorValue' id='behaviorValue' cols='50' rows='8'>"+value+  
    "</textarea><br/><input type='button' value='修改' onclick=\"saveBehaviorname(this.parentNode,'"+id+"')\" />"+  
    "<input type='button' value='取消' id='cancelButton' onclick='document.body.removeChild(this.parentNode);'/>";  
    document.body.appendChild(div);  
    document.all.behaviorValue.focus();  
}   

function saveBehaviorname(obj,id)
{
    var behaviorValue = document.all.behaviorValue.value;
    var idsArray = new Array(); //定义一数组 
    idsArray = behaviorValue.split("\n"); //字符分割
    var idsString = "";
    for (i = 0; i < idsArray.length; i++) 
    { 
    	var temp = idsArray[i].Trim();
    	if(temp != null && temp != "")
    	{
    		idsString = idsString + idsArray[i].Trim() + ";"
    	}
    } 
    var str = "";
    for (i = 0; i < idsArray.length; i++) 
    { 
    	str = str + idsArray[i].Trim();
    } 
    document.getElementById('receiver').value = idsString;
    document.body.removeChild(obj);
}  

function getoffset(e)   
{   
	var t=e.offsetTop;   
	var l=e.offsetLeft;   
	while(e=e.offsetParent)   
	{   
   		t+=e.offsetTop;   
   		l+=e.offsetLeft;   
	}   
	var rec = new Array(1);   
	rec[0] = t;   
	rec[1] = l;   
	return rec   
}

效果如图：