js中的常用方法

EmineWang發表於2013-10-21
JS

視窗操作

IE提供了window.screenLeft, window.screenTop物件來判斷視窗的位置，用document.body.offsetWidth和document.body.offsetHeight來獲取視口(顯示HTML的區域)的大小。

Mozilla提供window.screenX和window.screenY判斷視窗的位置，用window.innerWidth和window.innerHeight來判斷視口的大小，window.outerWidth和window.outerHeight來判斷瀏覽器自身的大小。

狀態列

可以通過window.status和window.defaultStatus屬性來獲取和改變狀態列內容，defaultStatus一直到使用者離開當前頁都有效，status則是暫時改變狀態列文字。比如

window.defaultStatus = "一直顯示這個文字"

<a ... onmouseover="window.status='滑鼠在此連結上' ">

時間間隔和暫停

window.setTimeout, 以及window.clearTimeout

window.setInterval, 以及window.clearInterval

document.write

<script type="text/javascript">

       document.write("<script type='text/javascript' src='...js'></script>")

</script>

上述程式碼會出錯，因為每當js遇到</script>時，假定其中的程式碼塊完整，因此，會把上述程式碼解析成

<script type=...>

       document.write("("<script type='text/javascript' src='...js'>

</script>

       ")</script>

為防止出現上述錯誤，document.write部分應

閱讀全文評論轉載#Javascript
23
07/2008
完美相容IE和Firefox的"全選/取消GridView中checkbox"

function selectAll(obj)

{

   var theTable = obj.parentNode.parentNode.parentNode.parentNode;

   var i;

   var j = obj.parentNode.cellIndex;

   for(i=1;i<theTable.rows.length;i++)

   {

       if(theTable.rows[i].cells.length<j) continue;

       var objCheckBox = theTable.rows[i].cells[j].getElementsByTagName('input')[0];

       if(objCheckBox.checked!=null)objCheckBox.checked = obj.checked;

   }

}

在Head的checkbox加上onclick="selectAll(this)"就可以，支援任意多列checkbox。

<asp:TemplateField HeaderText="&lt;input id='Checkbox1' type='checkbox' onclick='selectAll(this)' /&gt;序號">

                    <ItemTemplate>

                        <input id="Checkbox1" type="checkbox" onclick="Get_jdzh(this);" title='<%#Convert.ToString(Eval("cpdm")).Trim() %>' />

                    </ItemTemplate>

                </asp:TemplateField>

theTable.rows[i].cells[j].getElementsByTagName('input')[0];千萬不能用firstChild，否則FF下會出錯。

閱讀全文評論轉載#Javascript
12
06/2008
可以用滑鼠拖動的DIV

<html><head>

<title>測試可動div</title>

<script language='javascript' type='text/javascript'>

var offset_x;

        var offset_y;

        function Milan_StartMove(oEvent)

        {

            var whichButton;

            if(document.all&&oEvent.button==1) whichButton=true;

            else { if(oEvent.button==0)whichButton=true;}

            if(whichButton)

            {

                var oDiv=document.getElementById("oDiv");

                offset_x=parseInt(oEvent.clientX-oDiv.offsetLeft);

                offset_y=parseInt(oEvent.clientY-oDiv.offsetTop);

                document.documentElement.onmousemove=function(mEvent)

                { 

閱讀全文評論轉載#Javascript
10
06/2008
一個好工具-Aptana

Aptana是一個非常強大,開源,專注於JavaScript的Ajax開發IDE。它的特性包括： *JavaScript,JavaScript函式,HTML,CSS語言的Code Assist功能。 *Outliner(大綱)：顯示JavaScript,HTML和CSS的程式碼結構。

*支援JavaScript，HTML，CSS程式碼提示，包括JavaScript 自定函式

*程式碼語法錯誤提示。

*支援Aptana UI自定義和擴充套件。

*支援跨平臺。

*支援FTP/SFTP

*除錯JavaScript

*支援流行AJAX框架的Code Assist功能：AFLAX，Dojo，JQuery，MochiKit，Prototype，Rico，script.aculo.us，Yahoo UI，Ext。

*Adobe AIR與iPhone開發工具

有一個朋友寫的教程：

http://blog.csdn.net/samehai/archive/2007/06/30/1672516.aspx

記下來，貌似有點複雜的工具啊。

閱讀全文評論轉載#Javascript
08
05/2008
自己寫的用Js實現的動態增加表格

    function addEvent (o,c,h){

        if(o.attachEvent){

            o.attachEvent('on'+c,h);

        }else{

            o.addEventListener(c,h,false);

        }

        return true;}

    var selectRow;//頁面級js變數，用來存被選中的行，好在彈出視窗中對該行賦值

    function addnode()

    {

    var table=document.getElementById("Dy_table");

    var tr=table.insertRow();

    var cell0=tr.insertCell();

    var cell1=tr.insertCell();

    var cell2=tr.insertCell();

    var cell3=tr.insertCell();

    var cell4=tr.insertCell();

    var cell5=tr.insertCell();

    var cell6=tr.insertCell();

    var cell7=tr.insertCell();

    var cell8=tr.insertCell();

    var cell9=tr.insertCell();

    var hidden1=document.createElement("<input name='Dy_hd_cpdm' onpropertychange='textChange(this)' type='hidden' >");

    var hidden2=document.createElement("<input name='Dy_hd_sx' type='

閱讀全文評論(5)轉載#Javascript
28
03/2008
onkeyup，onkeydown和onkeypress

msdn上有三者的區別：

名稱 說明

onkeypress

這個事件在使用者按下並放開任何字母數字鍵時發生。系統按鈕（例如，箭頭鍵和功能鍵）無法得到識別。

onkeyup

這個事件在使用者放開任何先前按下的鍵盤鍵時發生。

onkeydown

這個事件在使用者按下任何鍵盤鍵（包括系統按鈕，如箭頭鍵和功能鍵）時發生。

======================

<html>

<script>

   function checkForm(){

    if(event.keyCode ==13){

     event.keyCode =9;

    }

   }

</script>

<body>

   <form name ="form1">

    <input type="text" name = "text1" onkeydown = "checkForm()">

    <input type="button" name = "button1" value="按鈕">

   </form>

</body>

</html>

當按下回車時，焦點從文字框移到按鈕上。如果把它換成“onkeypress”，焦點不會轉移，也不會失去。但是如果換成“onkeyup”，則失去焦

閱讀全文評論(1)轉載#Javascript
28
02/2008
js去空格 技巧

分別去字串前後，左邊，右邊空格

String.prototype.trim = function(){ return this.replace(/^\s+|\s+$/g,"")}

String.prototype.ltrim = function(){ return this.replace(/^\s+/g,"")}

String.prototype.rtrim = function(){ return this.replace(/\s+$/g,"")}

為String物件增加一個trim方法。

以後就可以這樣使用：

var s = " abc ";

s = s.trim(); // s是個String，可以使用剛定義的trim方法。

alert(s);

閱讀全文評論(2)轉載#Javascript
28
02/2008
js動態新增事件（帶引數）

js動態新增事件（帶引數）

var tt=function(obj)

     {

      return function()

      {

         alert(obj.tagName); //可以為外部定義的一個執行函式；

      }

     }

function addfunction()

{

var bigobj=document.getElementById("mytable");

var rows =bigobj.rows;

      for(var j=0; j<rows.length; j++)

      {

       for(var i=0;i<rows[j].cells.length;i++)

       {

           rows[j].cells[i].attachEvent("onmousemove",tt(rows[j].cells[i]));

           //rows[j].cells[i].onmousemove = function(){

           // tt();

           //}

          }

      }      &nb

閱讀全文評論(2)轉載#Javascript
26
02/2008
onchange和onpropertychange區別

當一個HTML元素的屬性用js改變的時候，都能通過 onpropertychange來捕獲。例如一個 <input name="text1" id="text1" />物件的value屬性被頁面的指令碼修改的時候，onchange無法捕獲到，而onpropertychange卻能夠捕獲。

也就是說：onpropertychange事件在用鍵盤每改變一下文字框的值或用js改變其值便會觸發一下，而onchange只有在用鍵盤改變其值，然後在失去焦點(onblur)後才觸發，用js改變其值不能觸發!onpropertychange和onchange都不管文字框中的實際值有沒有變，只要有改的相應操作就可能觸發。有時當上面兩時間都不能滿足需求時，可以考慮只用onblur。

閱讀全文評論(2)轉載#Javascript
29
12/2007
在子視窗中關閉父視窗

window.opener.opener=null;這一句非要,不然會彈出關閉提示.

window.opener.close();


[轉]把單元格顯示不下的文字用省略號代替，並且當mouseover時用提示資訊顯示全部內容

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

<META NAME="Generator" CONTENT="EditPlus">

<META NAME="Author" CONTENT="">

<META NAME="Keywords" CONTENT="">

<META NAME="Description" CONTENT="">

</HEAD>

<BODY>

<table border="1" style="table-layout:fixed">

<tr>

<td style="width:150px;overflow:hidden;text-overflow:ellipsis;"><div style="white-

space:nowrap;" title="" onmouseover="changeTitle(this)">這一行超出了範圍這一行超出

了範圍這一行超出了範圍這一行超出了範圍<div></td>

</tr>

<tr>

<td style="width:150px;overflow:hidden;text-overflow:ellipsis;"><div style="white-

space:nowrap;" title="" onmouseover="changeTitle(this)">這一行沒超範圍<div></td>

</tr>

<tr>

<td style="width:150px;overflow:hidden;text-overflow:ellipsis;"><div style="white-

space:nowrap;" title="" onmouseover="changeTitle(this)">這一行又超出了範圍這一行又

超出了範圍<div></td>

</tr>

</table>

</BODY>

</HTML>

<SCRIPT LANGUAGE="JavaScript">

JavaScript中eval的使用

計算一個表示式的值並返回結果。

[result = ]Eval(expression) 引數

result

可選項。是一個變數，用於接受返回的結果。如果未指定結果，應考慮使用 Execute 語句代替。

expression

必選項。可以是包含任何有效 VBScript 表示式的字串。

說明

eval 函式允許 JScript 原始碼的動態執行.

var aaa001="www.qtol.net";

    var username="aaa";

    var ID="001";

     alert(eval(username+ID));

上面的程式碼,會彈出結果 www.qtol.net, 如果去掉eval函式,則會彈出結果 aaa001

閱讀全文評論轉載#Javascript
06
11/2007
[轉]JavaScript經典技巧

oncontextmenu="window.event.returnValue=false" 將徹底遮蔽滑鼠右鍵

　　　　<table border oncontextmenu=return(false)><td>no</table> 可用於Table

　　 2. <body onselectstart="return false"> 取消選取、防止複製

　　3. onpaste="return false" 不準貼上

　　4. oncopy="return false;" oncut="return false;" 防止複製

　　5. <link rel="Shortcut Icon" href="favicon.ico"> IE位址列前換成自己的圖示

　　6. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夾中顯示出你的圖示

　　7. <input style="ime-mode:disabled"> 關閉輸入法

　　8. 永遠都會帶著框架

　　<script language="JavaScript"><!--

　　if (window == top)top.location.href = "frames.htm"; //frames.htm為框架網頁

　　// --></script>

　　9. 防止被人frame

　　<SCRIPT LANGUAGE=JAVASCRIPT><!--

　　if (top.location != self.location)top.location=self.location;

　　// --></SCRIPT>

　　10. 網頁將不能被另存為

　　<noscript><iframe src=*.html></iframe></noscript>

　　11. <input type=button value=檢視網頁原始碼

　　onclick="window.location = "view-source:"+ "http://www.webjx.com"">

　　12.刪除時確認

　　<a href="javascript:if(confir

閱讀全文評論轉載#Javascript
24
08/2007
windows.open()引數列表

這個在做網頁的時候用的著，都是一些控制視窗的屬性，很全，很好。前言:經常上網的朋友可能會到過這樣一些網站，一進入首頁立刻會彈出一個視窗，或者按一個連線或按鈕彈出，通常在這個視窗裡會顯示一些注意事項、版權資訊 、警告、歡迎光顧之類的話或者作者想要特別提示的資訊。其實製作這樣的頁面效果非常的容易，只要往該頁面的HTML里加入幾段javascript程式碼即可實現。下面我就帶您剖析它的奧祕。<br>

　 【1、最基本的彈出視窗程式碼】 　　

　　<SCRIPT LANGUAGE="javascript">

　　<!--

　　var win=window.open ('page.html');

win.resizeTo(screen.availWidth,screen.availHeight);//可以使視窗“最大化”

　　-->

　　</SCRIPT>

　　

　　因為著是一段javascripts程式碼，所以它們應該放在<SCRIPT LANGUAGE="javascript">標籤和</script>之間。<!-- 和 -->是對一些版本低的瀏覽器起作用，在這些老瀏覽器中不會將標籤中的程式碼作為文字顯示出來。要養成這個好習慣啊。window.open ('page.html') 用於控制彈出新的視窗page.html，如果page.html不與主視窗在同一路徑下，前面應寫明路徑，絕對路徑(http://)和相對路徑(../)均可。用單引號和雙引號都可以，只是不要混用。這一段程式碼可以加入HTML的任意位置，<head&g





相關文章