2009年12月

TechGuru开通wap访问

每天上班,下班乘坐404,在车上与其无聊,不如进入俺blog的lingo目录下看看英语单词,还是地道的英国伦敦、美国纽约腔哦。 用的是WP-T-Wap-一个国人开发的wap访问插件。 地址:m.tunps.com。我用的是域名商的url转向,打开m.tunps.com,代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TechGuru on Wap</title>
</head>
<frameset rows="*">
<frame name="main" frameborder="no" src="http://tunps.com/wap/">
</frame></frameset>
<noframes><body>
<script type="text/javasctipt">window.navigate('http://tunps.com/wap/');</script>
</body>
</noframes></html>

支持框架的直接打开http://tunps.com/wap/,不支持的js跳转到http://tunps.com/wap/。 这个插件支持wap2.0和1.1,方便我的老机子k510c访问。

javascript 查找select里面option的值

javascript 查找select里面option的值

有个任务,给个公司系统的“人员定岗”加入“人员查找”功能。 这个功能的界面如上图,左边的组织结构树,中间的一个id为left的select是该部门职位下的人员,右边是一个id为right的select,是整个组织的全部人员。可以对left里面的人员进行添加、删除、编辑,这就是“人员定岗”的大致功能。但是有个缺点,right列表里面的人员多了(比如几千甚至上万)就不好快速的找到需要的人。所以加入了查找功能。首先在插入一个文本框和按钮。

<input type="text" id="search_input" size="15" value="输入名字查找员工"   onFocus="this.value=' "  name="B2"  />
<input type="button" id="search_btn" value=" 查找 " onClick="search()" name="B2" class="btn2" />
<br />

然后是我写了3个小时的50行js代码加入页面头部的script标签中:

firstTime=1;//第一次点“查询”
function search()
{ if(firstTime) //如果是第一次点“查询”
{
//将完整的人员列表每个option的value和text保存在personText,personValue中
var search_input=document.getElementById("search_input").value;
var selectedPersonText=new Array();
var selectedPersonValue=new Array();
var l=0;
//将查询匹配的人员text,value单独赋值给两个数组
for(var k=0;k<len ;k++)
{
if(personText[k].indexOf(search_input)>-1)
{
selectedPersonText[l]=personText[k];
selectedPersonValue[l]=personValue[k];
l++;
}
}
//删掉所有option
remove_all(document.getElementById("right"));
//显示匹配的option
for(l-=1;l>=0;l--)
{
document.getElementById("right").options.add(new Option(selectedPersonText[l],selectedPersonValue[l]));
}
firstTime=0;//第一次点“查询”完毕
}
else //非第一次“查询”
{
var search_input=document.getElementById("search_input").value;
var selectedPersonText=new Array();
var selectedPersonValue=new Array();
l=0;
//将查询匹配的人员text,value单独赋值给两个数组
for(var k=0;k<persontext .length;k++)
{
if(personText[k].indexOf(search_input)>-1)
{
selectedPersonText[l]=personText[k];
selectedPersonValue[l]=personValue[k];
l++;
}
}
//删掉所有option
remove_all(document.getElementById("right"));
//显示匹配的option
for(l-=1;l>=0;l--)
{
document.getElementById("right").options.add(new Option(selectedPersonText[l],selectedPersonValue[l]));
}
}
}

下面的代码加入页面页脚的script标签中:

var len=document.getElementById("right").options.length;
var personText=new Array(len);
var personValue=new Array(len);
for (var k=0;k<len;k++)
{
personText[k]=document.getElementById("right").options[k].text;
personValue[k]=document.getElementById("right").options[k].value;
}

主要的思路就是:第一次加载页面的时候,从后台数据库把所有员工数据放到了right列表中,输入关键字点查询的时候首先将所有列表项的value和text读入到两个数组中,然后将输入的查询关键字一次和这两个数组用indexOf比较。
indexOf()的作用是查询某字符串是否输入它的一个子字符串,比如不包含返回-1。然后将查询符合要求的赋值给另外两个数组selectedPersonValue和selectedPersonText,先删除所有列表项,然后将这两个数组用options.add依次添加到列表项中。当第二次,第三次...点“查询”的时候,就快了,因为直接和内容中的两个数组比较。1400多个列表项,在IE6下面点“查询” cpu跳到60%~80%,Firefox下面 cpu为30%-40%。可能firefox对js的一些函数有优化吧。还有一点就是js放的位置也是有讲究的,比如这个例子中,读取right列表长度放在页面页首就不行。因为文档还没有加载完成,它是识别不出来列表right,会显示"undefined"。这次修改工作,对js有了近一步了解。我再次感谢firefox的牛逼扩展:firebug,调试js,just easy。

javascript模拟掷骰子生成1到6的随机数

var diceThrow=Math.round(Math.random()*5)+1;
document.write("You threw a " + diceThrow);

需要注意的是
0=< random() <1
round()四舍五入,比如round(1.4)=1 ,round(1.5)=2
ceil()总是向上取近似值,比如ceil(0.00000000001)=1
floor()总是向上取近似值,比如floor(0.9999999999999)=0

jquery.treeview插件绑定数据库(php+oracle)

公司的OA系统有个人员组织选定的功能,用的是MzTreeView这个js库,后台的人员信息表也是根据MzTreeView来设计的,也就是任意一条记录有一个id来唯一标识这条记录和一个parentId来记录它的父节点。

enter image description here

最近在学习jquery,找到了很多实用的插件,比如今天要说的是jquery.treeview

打算将jquery.treeview插件绑定到数据库,从数据库中取数据,用的脚本是php,后台数据库将就系统本来的oracle。在功能上其实mztreeview比jquery.treeview要强大一些,效率还高点。唯一好点就是js压缩后只有6k,而mztreeview有20多k。总之没事干,just 4 fun。

表结构:

Name Type Nullable Default Comments
------------- ------------- -------- ------- --------
ID_ROLE NUMBER(10)
CHAR_ROLENAME NVARCHAR2(30)
INT_ROLETYPE NUMBER(10)
ID_UPLEVEL NUMBER(10)
CHAR_REMARK VARCHAR2(50) Y
B_DELETE NUMBER(2)
INT_ORDER NUMBER(10) Y
DEPT_CODE NVARCHAR2(30) Y 'se'

ID_ROLE是unique id,ID_UPLEVEL是parent id。jquery下载下来之后,解压放到web目录,然后把下面的脚本文件放入demo目录。php脚本如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="content-type" content="text/html; charset=gb2312"/>
<title>treeview test on hoa</title>

<link rel="stylesheet" href="../jquery.treeview.css" />
<link rel="stylesheet" href="../red-treeview.css" />
<link rel="stylesheet" href="screen.css" />

<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../lib/jquery.cookie.js" type="text/javascript"></script>
<script src="../jquery.treeview.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
$("#browser").treeview({ //调用jquery.tree的代码
collapsed:true, //默认把组织树收缩起来
});
});
</script>
</head>
<body>

<h1 id="banner"> Demo</h1>
<div id="main">
<ul id="browser" class="treeview-red">
< ?php

function read($uplevel){ //递归函数,用来遍历树
$conn = oci_connect('ora_user', 'ora_pass', 'orcl');
if(!$conn)
{
print ("conn error");
}
$query = "SELECT * FROM sa_role where id_uplevel=".$uplevel." and b_delete='0' order by id_role";
//echo $query;
$stid = oci_parse($conn, $query);

$r = oci_execute($stid, OCI_DEFAULT);
while ($row = oci_fetch_array($stid, OCI_RETURN_NULLS))
{
if($row[2]==2) //$row[2]是INT_ROLETYPE,2是下面有子节点,1是叶子(就是没有子节点的节点)
{
print "<li> <span class=\"folder\">";
print $row[1]."</span> \n"; //$row[1]是节点内容,这个字段是CHAR_ROLENAME
print "\n\t</ul><ul>";
$uplevel=$row[0];
read($uplevel); //再调用自己继续读节点
}
if($row[2]==1) //如果是叶子
{

print "<li> <span class=\"file\">";
print $row[1]."</span> ";
print "</li>";
}
}
print "</ul>";
oci_close($conn);
}
read(-1);//假设根节点id为-1
print "";
?>

</div>

</body></html>

其中修改

<ul id="browser" class="treeview-red">

中class的值为treeview-red,treeview-default,treeview-black,treeview-gray,treeview-famfamfam,这些是jquery.treeview自带的样式。

可以在

$("#browser").treeview({ 
});

中,可以加入参数自定义,具体参数用法参照:http://docs.jquery.com/Plugins/Treeview/treeview#options
参数解释:
animated: "fast" 树的展开速度为快
collapsed: true 收缩树的所有节点
unique: true 保持每次展开1个节点,关闭之前打开的兄弟节点
persist: "location" 把进入的节点位置通过url保存

branches = $("<li class='closed'><span class='folder'>New Sublist</span><ul><li><span class='file'>Item1</span></li><li><span class='file'>Item2</span></li></ul></li>").prependTo("#folder21");
$("#browser").treeview({
add: branches
});

插入新节点

persist: "cookie" 把进入的节点位置通过cookie保存,需要jquery插件jquery.cookie.js
cookieId: "treeview-black" 设置cookie名
control: "#treecontrol" 把树的控制交给id为treecontrol

toggle: function() {  
window.console && console.log("%o was toggled", this);
}

设定一个交替函数

最后效果:

enter image description here

这里只做到了树的查看,还有有些问题需要解决,比如节点插入,删除,编辑与数据库的交互,貌似需要用到牛逼的ajax。

Encountered too many errors accepting client connections

今日电脑上的APACHE启动后CPU占用率一直高居100%, PHP程序也无法执行了。
查看错误日志里面记录了很多:

[error] (OS 10038)在一个非套接字上尝试了一个操作。 : Child 3356: Encountered too
many errors accepting client connections. Possible causes: dynamic
address renewal, or incompatible VPN or firewall software. Try using
the Win32DisableAcceptEx directive.

去到网上搜索,找到下面的解决方法:

编辑httpd.conf

Win32DisableAcceptEx ##加入这行  
ThreadsPerChild 250
MaxRequestsPerChild 0

重启apache就解决了。

修改后还是不行,仍然有错误记录,CPU占用率是降低了,但是还是没有恢复到原来的状态.logs里面还是一直在记录下面的错误报告。

[Mon Dec 24 16:48:06 2007] [error] (OS 10038)在一个非套接字上尝试了一个操作。 : Too many errors in select loop. Child process exiting.  
[Mon Dec 24 16:48:06 2007] [notice] Child 1916: Exit event signaled. Child process is ending.
[Mon Dec 24 16:48:07 2007] [notice] Child 1916: Released the start mutex
[Mon Dec 24 16:48:07 2007] [notice] Child 1916: Waiting for 250 worker threads to exit.
[Mon Dec 24 16:48:07 2007] [notice] Child 1916: All worker threads have exited.
[Mon Dec 24 16:48:07 2007] [notice] Child 1916: Child process is exiting
[Mon Dec 24 16:48:07 2007] [notice] Parent: child process exited with status 0 -- Restarting.
[Mon Dec 24 16:48:07 2007] [notice] Apache/2.0.55 (Win32) configured -- resuming normal operations
[Mon Dec 24 16:48:07 2007] [notice] Server built: Oct 9 2005 19:16:56
[Mon Dec 24 16:48:07 2007] [notice] Parent: Created child process 3028
[Mon Dec 24 16:48:07 2007] [notice] Disabled use of AcceptEx() WinSock2 API
[Mon Dec 24 16:48:07 2007] [notice] Child 3028: Child process is running
[Mon Dec 24 16:48:07 2007] [notice] Child 3028: Acquired the start mutex.
[Mon Dec 24 16:48:07 2007] [notice] Child 3028: Starting 250 worker threads.
[Mon Dec 24 16:48:08 2007] [notice] Child 3028: Listening on port 80.

最后搜索到与winsock有关,有网友也出现了这个问题,他认为是金山毒霸或者升级精灵修改了WinSock导致的。由于我电脑上也安装了金山毒霸,而且最近几天也升级过了,应该是同样的问题。于是搜索到恢复Winsock的方法:

netsh winsock reset

使用此条命令恢复后,重启电脑,这下Apache恢复当原先的良好状态了。我可以肯定又是dr.com在篡改winsock。希望遇见这样问题的朋友们能得到帮助~~!