欢 迎 光 临 数据载入中,请稍候......'s BLog
数据载入中,请稍候......
这就是我
数据载入中,请稍候......
用户登陆
数据载入中,请稍候......
最新公告
数据载入中,请稍候......
站点日历
数据载入中,请稍候......
最新日志
数据载入中,请稍候......
最新回复
数据载入中,请稍候......
最新留言
数据载入中,请稍候......
 日志搜索

友情链接
其他信息


·编写“点房搜索”页面代码过程中遇到的一些问题      -|cloudy 发表于 2006-11-11 15:03:00
一、分为卖房、买房、出租、求租、新房几类

两种思路:
1、做五个单独的页面,分别做上链接;
2、同一个页面中,仅显示其中一类,其它的隐藏起来,点击标签的时候显示相应的内容,其它的又隐藏起来。

对比各种优劣后,采用第二种思路,做法如下:
1、建五个<div>层,命名分别为div1~div5
2、写个javascript函数
 var x;
 function chgTo(x){
  var i;
  for(i=1;i<=5;i++){
   document.getElementById("Div"+i).style.display="none";
  }
  document.getElementById("Div"+x).style.display="";
 }
3、各标签上分别写上    onclick="chgTo(1)"   ~    onclick="chgTo(5)"   的响应代码

二、每一类搜索中,仅显示几项搜索选项,其它更多高级选项是隐藏的,做一个“显示更多高级搜索选项”的选择框,选中就显示更多选项,取消选中则隐藏更多选项:
1、写函数
 function showtable(obj){
  if (obj.style.display=="none"){
  obj.style.display="";
  }else {
  obj.style.display="none";
  }
 }
2、更多的高级搜索选项放在同一张table下,为table命名为“search_more_1”~“search_more_5”
3、加个选择是否显示更多选项的选择框:
<input name="search_more_1" type="checkbox" id="search_more_1" value="1" onClick="showtable(search_more_01)">更多高级搜索选项

三、关键词输入框的处理
1、思路:默认情况下输入框中显示“关键词”,光标移到该输入框时,判断一下输入框中的值,如为“关键词”则清空。光标移开输入框时,判断一下输入框中的值,如为空,则显示“关键词”
2、用 onClick="document.obj.search_key.value='';"只会响应:鼠标点中输入框时,清空输入框里所有内容,明显不合理
3、加两个函数
 function onFocuskeyword(obj)
 {
  if (obj.value == "关键词")
  {
   obj.value = ""
  }
 }
 
 function onBlurkeyword(obj,strTextName)
 {
  if (obj.value== "")
  {
   obj.value = "关键词"
  }
 }

4、使用函数:
 OnFocus="onFocuskeyword(formname.search_key)" OnBlur="onBlurkeyword(formname.search_key)"

5、至此,基本上OK。但有个新的问题:如果在输入框中只是输入了几个空格,则输入框失去焦点后会认为输入框的内容已经有变更了,不会显示默认的“关键词”
6、改进的函数(增加了一个去除字符串前后空格的函数,javascript没有内置的这种函数):
 function onFocuskeyword(obj)
 {
  if (obj.value == "关键词")
  {
   obj.value = ""
  }
 }
 
 function onBlurkeyword(obj,strTextName)
 {
  if (obj.value.Trim() == "")
  {
   obj.value = "关键词"
  }
 }
 function   String.prototype.Trim()   {return   this.replace(/(^\s*)|(\s*$)/g,"");}

四、点房搜索页面:
http://www.99fj.com/sou_index.asp
[阅读全文 | 回复(0) | 引用通告 | 编辑]

  • 标签:javascript代码 
  • 发表评论:
    数据载入中,请稍候......