vista

回顾※展望                     潜心技术&&不再搁浅

  BlogJava :: 首页 :: 联系 :: 聚合  :: 管理
  12 Posts :: 1 Stories :: 13 Comments :: 0 Trackbacks
这是一个小东东,有的时候用的着,呵呵。

<script language="javascript" >
    
function leftToRight(aa,bb,cc){
        
var selected;

        
var b = false;
        
var bLength = bb.length;
        
for(var i=0; i < aa.length; i ++ ){
            
if(aa[i].selected){
                
                selected 
= aa[i].value;
                
for(var j=0; j < bLength; j++){
                    
if(bb[j].value == selected)
                    b 
= true;
                }

                
if(!b){
                bb[bLength] 
= new Option(aa[i].text,selected);
                bLength 
++ ;
                
                }

                
if(cc)
                    aa[i] 
= null;
            }

        }

    
    }

    
function ee(){
        
var blist = form1.b;
        
var result = "";
        
for(var i = 0; i < blist.length; i++){
            result 
+= blist[i].value
            result 
+= "-";
        }

        alert(result);
    }

    
function search(){
        
var sear = form1.sear.value;
        
var alist = form1.a;
        
for(var i = 0; i < alist.length; i++){
            
//alert(sear.indexOf(alist[i].text));
            if(alist[i].text.indexOf(sear) == 0){
                
if(!alist[i].selected){
                alist[i].selected 
= true;
                
return true;
                }

            }

            
//return true;
        }

    }


</script>
<form name="form1" >
<input type="text" name="sear" /><input type="button" value="search" onClick="search();" />
<table width="40%" align="center"><tr><td height="200">
<select multiple name="a"  style="height:200px;width:100px;">
    
<option value="1">管理员1</option>
    
<option value="2">管理员2</option>
    
<option value="3">管理员3</option>
    
<option value="4">管理员4</option>


</select></td>
<td>
    
<input type="button" value=" >> " onClick="leftToRight(form1.a,form1.b);" /><br />
    
<input type="button" value=" << " onClick="leftToRight(form1.b,form1.a,true);" />
</td>
<td height="150">
<select multiple name="b" style="height:200px;width:100px;" >
    
    
<option value="11">管理员5</option>
    
<option value="22">管理员6</option>
</select>
</td></tr>
<tr><td colspan="2"><input type="button" value="提交" onClick="ee();" /></td></tr>
</table></form>

一个非常简单但使用的东东,呵呵
        <script language="javascript">
    
function chMode(num){
        
var a = document.getElementById(num);
        
if(a.style.display == "block"){
            a.style.display 
= "none";
        }

        
else{
                    a.style.display 
= "block";
        }

    }

    
    
</script>

例如,我们需要将一个table在需要的时候在页面显示,不需要的时候在页面隐藏,我们可以使用下面的代码:
<href="#" onClick="chMode('table1');" >点我</a>
<table id="table1" style="display:none">
.
</table>

第一次点击时,显示table,再次点击时,则隐藏了table.     ^_^

今天遇到一个问题,就是需要通过javascript代码判断上传图片的文件大小,上网搜索了下,找了些代码,整理个小例子如下:

<script language="javascript" >
function CheckFileSize()    
  
{    
        
var FileMaxSize = 100;//限制上传的文件大小,单位(k) 
      var   s   =   document.RegForm.Img_1.value;   
      
//if(s==""){alert("No image,please select again!");document.RegForm.Img_1.focus(); return   false;}    
     var   img   =   new   Image();    
     img.src   
=   s;  
     alert(img.fileSize);
     
if(img.fileSize>FileMaxSize*1024){
         alert(
"文件太大!");
         document.RegForm.Img_1.focus();
         
return false;
     }

     
if(img.fileSize == -1){
             alert(
"请上传图片!!");
             
return false;
         }

     
return true;
}

</script>   
<form action="a.htm" method="post"  enctype="multipart/form-data" name="RegForm"> 
    
<input type="file" name="Img_1" >
<input  type="button"  value="Save" onClick="return CheckFileSize()">
</form>

加一个判断并控制显示图片大小的代码:
<html><head>
    
<script language="javascript">
        
function reSize(){
            
var a = document.getElementById("img1");
            
var   img   =   new   Image(); 
            img.src 
= a.value;
            
if(a.width > 600)
                a.width 
= 600;
        }

    
</script>
    
</head>
<body onload="reSize();">
<IMG src="1.jpg" style="border:1px #ff0000 solid" name=ntimg id="img1" >
</body></html>

加个 location.href , location.reload();
posted on 2006-10-13 20:39 Vista 阅读(1804) 评论(10)  编辑  收藏 所属分类: web相关

Feedback

# re: vista精神之 --javascript篇 2006-10-13 22:17 坏男孩
顶~~~  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-13 22:23 马嘉楠
1)function leftToRight()可以做点修改啊
原来的我操作了一下有点问题,左面的管理员进入右面之后
左面的list里面依然存在

可以去掉leftToRight()中的cc参数,以及if(cc)语句,调用该函数的时候也不需要第三个参数了


2)function ee() 看你写的代码就是显示右侧列表内容,原来也是要实现这个功能么?

修改后的 leftToRight()

function leftToRight(aa,bb){//aa原来的列表,bb目的列表
var selected;

var b = false;
var bLength = bb.length;
for(var i=0; i < aa.length; i ++ ){
if(aa[i].selected){

selected = aa[i].value;
for(var j=0; j < bLength; j++){
if(bb[j].value == selected)
b = true;
}
if(!b){
bb[bLength] = new Option(aa[i].text,selected);
bLength ++ ;

}
aa[i] = null;//删除原来列表中选中的管理员

}
}

}


修改后的 function ee()
function ee(){
var blist = form1.b;
var result = "";
for(var i = 0; i < blist.length; i++){
result += "right list " + (i+1) + " = " + blist[i].text;
result += "\n";
}
alert(result);
}
这样看得更明白,呵呵  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-14 01:41 vista--
二楼的看的仔细啊,改了也可以,没改的话,也是和具体需求相关的,呵呵  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-14 09:32 马嘉楠
哈哈,明白了
是我想当然了^+^
很有用的东西  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-16 14:50 尤士期
请问为什么点击“<<”和“点我”时,那两个多选框会闪动呢?有没有办法不闪呀?:-)  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-17 10:15 greco
我现在不太用自己写的Javascript代码,一般都会用一些JS的框架,比如JQuery,Prototype等等。比如你那个显示隐藏Table就只要 Element.hide();Element.show();就可以了。  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-17 12:42 cwocwo
第一个例子有bug, 多选的时候有问题。
有时项已移到右边, 可左边没去掉
  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-17 14:03 Vista
回 cwocwo:
我在具体业务的时候,左边是不需要去掉的,如果要去掉的话,也很简单,
因为具体业务的时候,左边是所有供选择的集合,而右边的是用户选择的,
呵呵  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-18 15:29 123bingbing
增开7群,号码 30440732
8群 30756649
9群 30178567
10群 28694497

我们的qq群:15096318 学习程序的都可以来
  回复  更多评论
  

# re: vista精神之 --javascript篇 2006-10-28 03:28 Dedian
hi, buddy, i have sent an email to u about customized Google Search engine  回复  更多评论
  


只有注册用户登录后才能发表评论。


网站导航: