vista

回顧※展望潛心技術&&不再擱淺

BlogJava :: 首頁 :: 聯系 :: 聚合

:: 管理

12 Posts :: 1 Stories :: 13 Comments :: 0 Trackbacks

vista精神之－－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>

</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在需要的時候在頁面顯示，不需要的時候在頁面隱藏，我們可以使用下面的代碼：

<a?href="#"?onClick="chMode('table1');"?>點我</a>

<table?id="table1" style="display:none">

</table>

第一次點擊時，顯示table，再次點擊時，則隱藏了table.???? ^_^

今天遇到一個問題，就是需要通過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>

加一個判斷并控制顯示圖片大小的代碼：

????<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 閱讀(1841) 評論(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 回復更多評論

新用戶注冊刷新評論列表


只有注冊用戶登錄后才能發表評論。




網站導航: 博客園 IT新聞 Chat2DB C++博客博問管理
相關文章: vista精神之---dom4j入門(轉貼) 轉－JS正則表達式詳解[來自javaeye] vista精神之－－javascript篇

vista

常用鏈接

留言簿(1)

隨筆分類

隨筆檔案

文章檔案

搜索

最新評論

閱讀排行榜

評論排行榜

Feedback