CGI程序学习(6)-在CGI程序中实现Html加载的Dialog弹出框
2014-11-05 16:06
393 查看
公司项目中需要配置网络,获取WIFI列表后在网页上需要选择WIFI名称和输入密码,点击确定后底层会执行一个Shell时,该Shell需要耗时2-5秒,这时候我们需要一个弹出框阻挡用户点击其他实现一个执行加载的过程,原以为会跟Android一样简单,后来发现还是有很多需要注意的地方,备份记忆.
获取WIFI列表后显示如下图:
输入密码后点击设置,显示弹出框效果如下图:
---------------------------------------------------------------------------------分割线-------------------------------------------------------------------------------------
第一张图的CGI程序为:
点击按钮后会先执行sAlert(),该程序为一个弹出框Dialog,用来加载等待,CGI代码如下:
解决问题的整个过程中,先碰到是该弹出框代码如何实现,参考了该代码:http://www.veryhuo.com/a/view/38279.html
然后碰到的问题是在C代码中%的使用,编译的时候一直无法执行这段代码
会报类似warning: unknown conversion type character * in format的问题.
百度查找原因发现因为%对printf函数比较特殊,所以需要进行特殊处理.
当你想用printf输出一个 % 的时候,需要这样使用 printf("%%"),
获取WIFI列表后显示如下图:
输入密码后点击设置,显示弹出框效果如下图:
---------------------------------------------------------------------------------分割线-------------------------------------------------------------------------------------
第一张图的CGI程序为:
<span style="white-space:pre"> </span>printf("<form class=\"form-horizontal\" action=\"/cgi-bin/setpwd.cgi\">\n"); printf(" <div class=\"control-group\">\n"); printf(" <label class=\"control-label\" for=\"selectError\">WIFI 名称:</label>\n"); printf(" <div class=\"controls\">\n"); printf(" <select name=\"name\" style=\"width:260px\" id=\"selectError\" data-rel=\"chosen\">\n"); for(j = 0; j < array_number ; j++) { printf("<option value=\"%s\">%s</option>\n",wifiname_user[j],wifiname_user[j]); } printf(" </select>\n"); printf(" </div>\n"); printf(" </div>\n"); printf(" <div class=\"control-group\">\n"); printf(" <label class=\"control-label\" for=\"focusedInput\">WIFI 密码:</label>\n"); printf(" <div class=\"controls\">\n"); printf(" <input id=\"pwdInput\" style=\"width:250px\" class=\"input-xlarge focused\" required=\"required\" type=\"text\" name=\"pwd\">\n"); printf(" </div>\n"); printf(" </div>\n"); printf(" <div class=\"form-actions\">\n"); printf(" <button type=\"submit\" class=\"btn\" onclick=\"sAlert()\">设置</button>\n"); printf(" <button type=\"reset\" class=\"btn\">取消</button>\n"); printf(" </div>\n"); printf("</form>\n");
点击按钮后会先执行sAlert(),该程序为一个弹出框Dialog,用来加载等待,CGI代码如下:
<span style="white-space:pre"> </span>printf("<script type=\"text/javascript\" language=\"javascript\">\n"); printf("function sAlert()\n"); printf("{\n"); printf(" var valuePwd = document.getElementById(\"pwdInput\").value;\n"); printf(" if(valuePwd!=null && valuePwd!=\"\")\n"); printf(" {\n"); printf(" var msgw,msgh,bordercolor;\n"); printf(" msgw=400;//提示窗口的宽度\n"); printf(" msgh=100;//提示窗口的高度\n"); printf(" titleheight=25 //提示窗口标题高度\n"); printf(" bordercolor=\"#26292e\";//提示窗口的边框颜色\n"); printf(" titlecolor=\"#99CCFF\";//提示窗口的标题颜色\n"); printf(" var sWidth,sHeight;\n"); printf(" sWidth=document.body.offsetWidth;\n"); printf(" sHeight=screen.height;\n"); printf(" var bgObj=document.createElement(\"div\");\n"); printf(" bgObj.setAttribute(\'id\',\'bgDiv\');\n"); printf(" bgObj.style.position=\"absolute\";\n"); printf(" bgObj.style.top=\"0\";\n"); printf(" bgObj.style.background=\"#26292e\";\n"); printf(" bgObj.style.filter=\"progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75\";\n"); printf(" bgObj.style.opacity=\"0.6\";\n"); printf(" bgObj.style.left=\"0\";\n"); printf(" bgObj.style.width=sWidth + \"px\";\n"); printf(" bgObj.style.height=sHeight + \"px\";\n"); printf(" bgObj.style.zIndex = \"10000\";\n"); printf(" document.body.appendChild(bgObj);\n"); printf(" var msgObj=document.createElement(\"div\")\n"); printf(" msgObj.setAttribute(\"id\",\"msgDiv\");\n"); printf(" msgObj.setAttribute(\"align\",\"center\");\n"); printf(" msgObj.style.background=\"white\";\n"); printf(" msgObj.style.border=\"1px solid\" + bordercolor;\n"); printf(" msgObj.style.position = \"absolute\";\n"); printf(" msgObj.style.left = \"50%%\";\n"); printf(" msgObj.style.top = \"50%%\";\n"); printf(" msgObj.style.font=\"12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif\";\n"); printf(" msgObj.style.marginLeft = \"-225px\" ;\n"); printf(" msgObj.style.marginTop = -75+document.documentElement.scrollTop+\"px\";\n"); printf(" msgObj.style.width = msgw + \"px\";\n"); printf(" msgObj.style.height =msgh + \"px\";\n"); printf(" msgObj.style.textAlign = \"center\";\n"); printf(" msgObj.style.lineHeight =\"25px\";\n"); printf(" msgObj.style.zIndex = \"10001\";\n"); printf(" var title=document.createElement(\"h4\");\n"); printf(" title.setAttribute(\"id\",\"msgTitle\");\n"); printf(" title.setAttribute(\"align\",\"right\");\n"); printf(" title.style.margin=\"0\";\n"); printf(" title.style.padding=\"3px\";\n"); printf(" title.style.background=bordercolor;\n"); printf(" title.style.filter=\"progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);\";\n"); printf(" title.style.opacity=\"0.9\";\n"); printf(" title.style.border=\"1px solid\" + bordercolor;\n"); printf(" title.style.height=\"18px\";\n"); printf(" title.style.font=\"12px Verdana, Geneva, Arial, Helvetica, sans-serif\";\n"); printf(" title.style.color=\"white\";\n"); printf(" title.style.cursor=\"pointer\";\n"); printf(" title.innerHTML=\"关闭\";\n"); printf(" title.onclick=function()\n"); printf(" {\n"); printf(" document.body.removeChild(bgObj);\n"); printf(" document.getElementById(\"msgDiv\").removeChild(title);\n"); printf(" document.body.removeChild(msgObj);\n"); printf(" }\n"); printf(" document.body.appendChild(msgObj);\n"); printf(" document.getElementById(\"msgDiv\").appendChild(title);\n"); printf(" var txt=document.createElement(\"p\");\n"); printf(" txt.style.margin=\"1em 0\";\n"); printf(" txt.setAttribute(\"id\",\"msgTxt\");\n"); printf(" txt.style.color=\"black\";\n"); printf(" txt.style.font=\"12px Verdana, Geneva, Arial, Helvetica, sans-serif\";\n"); printf(" txt.innerHTML=\"<img src=\'../img/loding.gif\'><p>配置网络中...</p>\";\n"); printf(" document.getElementById(\"msgDiv\").appendChild(txt);\n"); printf(" }\n"); printf("}\n"); printf("</script>\n");
解决问题的整个过程中,先碰到是该弹出框代码如何实现,参考了该代码:http://www.veryhuo.com/a/view/38279.html
然后碰到的问题是在C代码中%的使用,编译的时候一直无法执行这段代码
printf(" msgObj.style.left = \"50%\";\n"); printf(" msgObj.style.top = \"50%\";\n");
会报类似warning: unknown conversion type character * in format的问题.
百度查找原因发现因为%对printf函数比较特殊,所以需要进行特殊处理.
当你想用printf输出一个 % 的时候,需要这样使用 printf("%%"),
printf(" msgObj.style.left = \"50%%\";\n"); printf(" msgObj.style.top = \"50%%\";\n");代码修改后就能正确运行了.其中问题还是有的,字体感觉不是很好,有模糊的感觉,可能跟透明度设定有关,有解决办法的同学赶紧@我.
相关文章推荐
- ProgressDialog+Thread实现弹出进度条数据异步加载(配有效果图)
- android 开发零起步学习笔记(二十九):Android笔记:实现加载的progressDialog之后跳转到程序主界面
- (Android实战)ProgressDialog+Thread实现弹出进度条数据异步加载(配有效果图)
- asp.net实现页面的一般处理程序(CGI)学习笔记
- (Android实战)ProgressDialog+Thread实现弹出进度条数据异步加载(配有效果图)
- asp.net实现页面的一般处理程序(CGI)学习笔记
- CGI程序学习(5)-用到的工具和一个不错的集成html网页源代码
- ProgressDialog+Thread实现弹出进度条数据异步加载(配有效果图)
- CSS学习笔记-附加篇( CSS+JS实现的选项卡效果(html组件))
- window.dialogArguments的使用 html弹出对话框
- SWT 中实现最小化到托盘图标,并只能通过托盘的弹出菜单关闭程序
- 用Flex的编译参数实现AS3程序的自身预加载(Self Preloading)
- 驱动学习笔记2-用程序加载NT驱动程序
- 用MFC实现WebGUI--(CDHtmlDialog)
- 在Dialog中创建一个htmlview(CHtmlView类)区,实现浏览网页
- 转载,用MFC实现WebGUI--(CDHtmlDialog)
- silverlight 初始页面进行安装主应用(初始安装xap,本地加载xap),实现silverlight程序成桌面应用程序。
- asp.net 计划任务管理程序实现,多线程任务加载
- LISP 学习笔记 (三) -编辑,加载和编译LISP程序
- python cgi ajax - 使用CGIHTTPServer实现一个ajax程序