这段JS代码可以再精简么?

panzi667 2010-03-19 09:58:31
<script>
function changsheng(va) {
if(va!='0')
{
var city = document.getElementById("city");
city.disabled=false;
var qu = document.getElementById("qu");
qu.disabled=true;
var f=document.getElementById("qu");
f.options.length=1;
var url="/Handler.ashx?type=sheng&id="+va;
send_request("GET",url,null,"text",populateClass3);
}
}
function populateClass3(ddd){
var f = document.getElementById("city");
if(http_request.readyState==4){
if(http_request.status==200){
var list=http_request.responseText;
var classList=list.split("|");
f.options.length=1;
for(var i=0;i<classList.length;i++){
var tmp=classList[i].split(",");
f.add(new Option(tmp[1],tmp[0]));
}
}else{
alert("您所请求的页面有异常1。");
}
}
}
function changshi(va)
{
if(va!='0')
{
var qu = document.getElementById("qu");
qu.disabled=false;

var url="/Handler.ashx?type=shi&id="+va;
send_request("GET",url,null,"text",populateClass4);

}
}
function populateClass4(){
var f=document.getElementById("qu");
if(http_request.readyState==4){
if(http_request.status==200){
var list=http_request.responseText;
var classList=list.split("|");
f.options.length=1;
for(var i=0;i<classList.length;i++){
var tmp=classList[i].split(",");
f.add(new Option(tmp[1],tmp[0]));
}
}else{
alert("您所请求的页面有异常2。");
}
}
}

</script>
...全文
124 11 打赏 收藏 转发到动态 举报
写回复
用AI写文章
11 条回复
切换为时间正序
请发表友善的回复…
发表回复
lianqin7 2010-03-26
  • 打赏
  • 举报
回复

function $(id)
{
typeof id == "string" ? document.getElementById(id) : id;
}

//增加type参数区别不同的请求
function change(type, va)
{
if (type && va)//va!='0'等同于va,进行了类型转换
{
var bOK = true;
switch (type) //不清楚LZ的业务逻辑,这里应该还可以简化,LZ自己看吧
{
case "sheng":
var city = $("city");
city.disabled=false;
var qu = $("qu");
qu.disabled=true;
var f=$("qu"); //这里2次的ID都是qu,不明白,估计是LZ写错了
f.options.length=1;
var r = c; //给回调函数用的
break;
case "shi":
var qu = $("qu");
qu.disabled=false;
var r = qu; //给回调函数用的
break;
default:
bOK = false;
}
if (bOK)
{
var url="/Handler.ashx?type=" + type + "&id="+va;
send_request("GET",url,null,"text",function (){ //匿名函数传递参数
populate(r);
});
}
}
}

function populate(f){ //f通过参数获得
//var f = document.getElementById("city");
if(http_request.readyState==4)
{
if(http_request.status==200)
{
var list=http_request.responseText;
var classList=list.split("|");
f.options.length=1;
for(var i=0;i<classList.length;i++)
{
var tmp=classList[i].split(",");
f.add(new Option(tmp[1],tmp[0]));
}
}
else
{
//这里的异常出错对用户来说都是一样的,返回1或者2只是给程序员看的
//如果真要区分,可以靠f.name或其他f的属性来区分
alert("您所请求的页面有异常。");
}
}
}
fengjia123123123 2010-03-26
  • 打赏
  • 举报
回复
六楼说的挺对的,这段javascript代码,还好多地方可见精简,比如这个变量
var f=document.getElementById("qu");

你在还多方法中都用了,可以考虑将document.getElementById("qu")提出来作为一个全局变量,
可以考虑用apply和闭包还可以简化,好好理解一下javascript的闭包,面向对象的原理。

p.s.
Just advice.
passself 2010-03-25
  • 打赏
  • 举报
回复
楼主不用jquery就算是比较精简的了
panzi667 2010-03-25
  • 打赏
  • 举报
回复
顶顶, 回复内容太短了!
浴火_凤凰 2010-03-19
  • 打赏
  • 举报
回复
已经够精简了吧
panzi667 2010-03-19
  • 打赏
  • 举报
回复
如果不用jquery框架,这段代码就不能精简了么?
  • 打赏
  • 举报
回复
用jquery框架
pillar0514 2010-03-19
  • 打赏
  • 举报
回复
看一遍jquery和mootools的源代码,你就知道你能简化的地方多了去了。
pillar0514 2010-03-19
  • 打赏
  • 举报
回复
用apply和闭包还可以简化。
jiewenxu 2010-03-19
  • 打赏
  • 举报
回复
比较精简了已经
lodachi 2010-03-19
  • 打赏
  • 举报
回复

function $(id){
return document.getElementById(id);
}

document.getElementById("city"); 就可以写成$("city"),可以省很多代码。

87,903

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧