爪哇岛描述语言自定义提示窗口效果图：

源码：

1.demo.jsp

"%@"页面内容类型=' text/html；charset=UTF-8 "语言="Java"% html标题自定义提示窗口/title脚本类型=' text/JavaScript ' src=' http : js/myalert。js /脚本脚本类型=' text/JavaScript '函数body on load(){ var MyInput=document。getelementbyid(' MyInput ')；我的输入。风格。边框=“无”；我的输入。风格。背景色=' rgba(223，230，223，0.3)'；myInput.value='请输入你的名字：';我的输入。onfocus=function(){ myinput。风格。outline=' nonemyInput . value=}；var image _ div=文档。创建元素(' div ')；image _ div。风格。width=我的输入。偏移心；image _ div。风格。高度=我的输入。偏移光线；image _ div。风格。float=' rightimage _ div。风格。光标='指针'；image _ div。onclick=function(){ new MyAlert().警报('系统提示，'点击image_div '，5000)；};var outer _ div=文档。创建元素(' div ')；outer_div.style.border='1px纯红；outer _ div。风格。width=parsent(myinput。offsetwidth)解析器(image _ div。风格。宽度)；outer _ div。风格。高度=我的输入。偏移光线；文件。尸体。append child(outer _ div)；outer _ div。append child(MyInput)；outer _ div。append child(image _ div)；}/script/head body on load=' body on load()' input id=' myInput ' type=' text ' name=' name ' title='名字//body/html2.myAlert.js

/** *朱文琪2017/6/20创作。*//* * * @参数选项基本配置* @ constructor */function MyAlert(options){ this。选项=选项；}/** * 提示窗口* @param标题提示标题，默认为* @param内容提示内容，默认为" * @ param closeTime "提示窗口自动关闭时间，单位为女士们，默认为2000 ms */myalert。原型。alert=函数(标题、内容、closeTime){ var div _ background=document。创建元素(' div ')；div _背景。风格。位置='绝对'；div _背景。风格。left=' 0div _背景。风格。top=' 0div _背景。风格。宽度=' 100% '；div _背景。风格。高度=' 100% '；div _背景。风格。background COlOr=' rgba(0，0，0，0.1)'；div _背景。风格。zindex=' 1001var div _ alert=文档。创建元素(' div ')；div _ alert。风格。位置='绝对'；div _ alert。风格。左=' 40% '；div _ alert。风格。top=' 0div _ alert。风格。宽度=' 20% '；div _ alert。风格。高度=' 20% '；div _ alert。风格。溢出=' autodiv _ alert。风格。background COlOr=' rgba(255，255，255，0.5)'div _ alert。风格。zindex=' 1002div_alert.style.border='1px纯蓝；div _ alert。风格。borderradius=' 10pxdiv _ alert。风格。BoxShadow=' 0 0 10px grayvar div _ title=文档。创建元素(' div ')；div _ title。风格。background COlOr=' rgba(0，255，0，0.3)'；div _ title。风格。textalign=“居中”；var span _ title=文档。创建元素(“span”)；span _ title。风格。font size=' 20pxspan _ title。风格。字体粗细='粗体'；var text _ title=文档。createtextnode((title===未定义| | title===null)？”' :标题);span _ title。appendchild(text _ title)；div _ title。append child(span _ title)；div _ alert。append child(div _ title)；var div _ content=文档。创建元素(' div ')；div _内容。风格。行高=' 35pxdiv _内容。风格。左填充=' 10pxvar span _ content=document。创建元素(“span”)；var text _ content=文档。createtextnode((内容===未定义| |内容===null)？”' :内容);span _内容。append child(text _ content)；div _内容。append child(span _ content)；div _ alert。append child(div _ content)；文件。尸体。appendchild(div _ background)；文件。尸体。append child(div _ alert)；setTimeout(函数(){文档。尸体。移除子项(div _ alert)；文件。尸体。移除子项(div _ background)；}，(closeTime===未定义| | closeTime===null | | closeTime===' ')？2000 : closeTime)；};以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。