顯示具有 javascript 標籤的文章。 顯示所有文章
顯示具有 javascript 標籤的文章。 顯示所有文章

2012年10月22日 星期一

Javascript 與 Java 合用

JavaScript 存取 Java Applet 的函數




在本例中，我們使用 JavaScript 的事件處理程序 onClick 去 呼叫 Java Applet，並將輸入欄位中的值由 Java Applet 顯示出來。 說明︰
  • Form 的內容 
    <form name="form1">
<input type="text" name="text1">
<input type="button" value="變換文字"
       onClick="document.ControlJava.SetMessage(document.form1.text1.value);">
</form>
<applet name="ControlJava" code="ControlJava.class" width="450" height="120">
</applet>
  • Applet 的內容
  • Java applets 也有一些困擾。例如，這個網頁的 applet 在 05/28/2007 之前 是利用JDK 1.2 版所 compile 的，在當時可以正確無誤的呈現中文。可以在 JDK 1.5 給 browser 的外掛程式之下卻無法正確的顯示中文，我必須重新以 JDK 1.5 compile 這個 applet 之後才能正確的顯示。希望以後，這類的困擾可以減少。


張貼者： 於 沒有留言:
標籤： , ,

Javascript 與 Perl 合用

主從式架構


一個好的主從式的應用程式， 應該在使用者輸入時便立即確認其輸入值是否為 valid （可用 VBScript, JScript, JavaScript, PerlScript 等.)， 然後才將 確認過的資料後傳至伺服器端處理程式 （如 CGI， ASP 等）。在以下範例中，使用者 可以在郵遞區號內輸入“aaa“，然後按”確定“，網頁會告訴你輸入的郵遞區號必須是數字。
範例：
郵遞區號： 傳真號碼：
閱讀更多 »
張貼者： 於 沒有留言:
標籤： , ,

Dynamic HTML (III)


Dynamic HTML (III)


範例：同時利用 DOM 以及 CSS 來動態呈現選項的結果。在實務上，我們經常 會依照使用者選擇的結果，來呈現某些特定的結果。例如，在本範例中， 使用者可以選擇"高雄"（我出生以及成長的地方）或者"台中"（我回台之後 工作的城市），然後程式會依照使用者選擇的都市來顯示該都市的行政區域。 請注意： 這個作法其實不是很好，因為載入網頁的時候，我們必須 先把所有的選項資料都載入，這容易造成不必要的資料傳送，而且資料的維護上 也比較不方便，我們建議採用 Ajax 的方式進行，這個範例只是用來展現 DOM 和 CSS 合用下可以完成的工作範例。
城市：
行政區：
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

Dynamic HTML (II)


Dynamic HTML (II)


範例：我們定義了三個訊息，而這些訊息存放在陣列中；只要使用者在 "Click to change" 的按鈕上按一下，這些訊息就會順序的顯示出來。
原始碼：
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

Dynamic HTML (I)


Dynamic HTML (I)


範例：請將滑鼠移到範例中藍色的圓圈上，你會發現他會變成紅色圓圈。當你把滑鼠移出，又會回到藍色的圓圈。 : onMouseOver
原始碼：
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

Javascript: window 物件

window 物件


本例題使用的語法為： 
<body onLoad="newwin=window.open('http://web.nchu.edu.tw/~jlu',
        'targetname','height=300,width=400,toolbar=no,status=yes')">
說明：
  • window 物件的方法：
    • window.open(): open() 函數會傳回新視窗的物件 （如 newwin）。
      1. 第一個參數為 URL。
      2. 第二個參數為新開啟的視窗名稱。 此名稱可用於 <a> 的 target 參數。
      3. 第三個參數為視窗特色的描述。 描述的方式有：
        • height: 高度
        • width: 寬度
        • toolbar: 是否顯示工具列
        • status: 是否顯示狀態列
    • window.close(): 如要關閉剛剛開啟的視窗， 可使用 newwin.close();
  • window 物件的事件程序：
    • onLoad
    • onUnLoad
    • onFocus
    • onBlur
張貼者： 於 沒有留言:
標籤： ,

Javascript 事件處理


事件處理


範例：事件的處理（例如使用者在按鈕上點一下，即產生一個事件）是 Javascript 的一個強項。在這個範例中，我們試圖說明常用的 Javascript 的事件，以及其對應 的物件。 javascript:function: JavaScript Pseudo Protocol.

說明：這個範例由兩個部分所組成：一個是 HTML 的元件，而另一個是與其配合的 Javascript 程式碼。我們依序說明 HTML 元件並解釋與其配合的程式碼；至於，整個 網頁的內容應該如何設定，請讀者自行檢視本網頁的原始碼。
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

Alert, Confirm, and Prompt


Alert, Confirm, and Prompt


範例：在本範例中，我們介紹三個最常用的對話視窗。其中，我們曾經介紹過 alert() 以及 prompt()。在操作這個範例時，如果出現"取消"按鈕，請記得也 點選它，並觀察結果有何不同。如果你想不斷重複操作，你只需要在瀏覽器上點選 "重載"即可。
原始碼：
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

Functions 的宣告與使用


Functions 的宣告與使用


範例：在這個範例中，我們說明函數（function）的宣告以及使用的方式。 範例中，我們定義了三個最常見的函數型態：world() 方法沒有傳入的參數， 也沒有回傳結果；hello(someone) 方法包含一個傳入的參數，但是沒有回傳結果； 還有，input() 方法，該方法沒有傳入的參數，卻有回傳結果。 定義完了方法之後，在程式碼的最後，我們分別呼叫這些方法。
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

認識「註解」，「變數」等

認識「註解」，「變數」等


範例：從使用者取得三個分數（或者成績），將三個分數存放在陣列中， 最後利用迴圈計算平均分數。這個範例同時涵蓋了變數的宣告，註解的 使用，陣列的宣告／使用，以及 for 迴圈敘述。
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

JavaScript 的基本架構

JavaScript 的基本架構


範例：
原始碼：
<body>
<script language="javascript">
<!--
  document.write("<h2>Hello World.</h2>");
// -->
</script>
</body>
介紹所有程式語言的第一個程式，當然非 Hello World 莫屬。在範例下出現的 Hello World 是由 JavaScript 程式碼所產生的。 說明：
閱讀更多 »
張貼者： 於 沒有留言:
標籤： ,

JavaScript 入門

JavaScript 入門

The following examples had been tested on Netscape's Navigator, Microsoft's IE, and Opera. The document is provided as is. You are welcomed to use it for non-commercial purpose.

這是一份 Javascript 的講義，因為是為了我上課的目標而編寫的。寫這份 講義的時候，我假設讀者（也就是我的學生）已經會寫 Java （或者其他類似 的物件導向程式語言），非常多的觀念都是從物件來解釋的。如果不清楚 Java 或者想了解物件，請參考我和陳宜惠寫的 Java 101 物件導向程式設計。 Javascript 和 Java 一點兒關係也沒有。 Java 是由 Sun 所發展出來的語言， 而 Javascript 是由 Netscape Communication Company 所獨立開發。目前， JavaScript 已經有了標準，稱之為 ECMAScript，只是現有的瀏覽器所使用的 JavaScript 都另外新增一些功能，使得在 Firefox 上能執行的 JavaScript 不一定 可以在 Microsoft 的 Internet Explorer 上執行。

Written by: 國立中興大學資訊管理學系呂瑞麟

張貼者： 於 沒有留言:
標籤： ,
訂閱： 文章 (Atom)