JavaScript の使い方

Size: px

Start display at page:

Download "JavaScript の使い方"

るるみやたけ
7 years ago
Views:

1 JavaScript Release10.5 JavaScript NXJ JavaScript JavaScript JavaScript 2 JavaScript JavaScript JavaScript NXJ JavaScript 1: JavaScript 2: JavaScript 3: JavaScript 4: 1

2 1: JavaScript JavaScript NXJ Static Content > JavaScript.js // Writes the current time in the clock <div> function setclock() { var time = new Date(); var hours = time.gethours(); var minutes = time.getminutes(); minutes=((minutes < 10)? "0" : "") + minutes; var seconds = time.getseconds(); seconds=((seconds < 10)? "0" : "") + seconds; document.getelementbyid('clock').innerhtml = hours + ":" + minutes + ":" + seconds; //set a timer to change the clock every second timer = settimeout("setclock()",1000); // Renders the clock <div> to the HTML document function drawclock() { document.write("<div id='clock'></div>"); setclock(); clock.js NXJ 2: JavaScript JavaScript JavaScript Unify NXJ JavaScript 2

3 X JavaScript Java 3: JavaScript 3 JavaScript Includes JavaScript Links Includes JavaScript Includes Select JavaScript Files JavaScript clock.js OK JavaScript JavaScript JavaScript JavaSctipt JavaScript JavaScript HTML drawclock() drawclick() OK Unify NXJ JavaScript 3

4 Links JavaScript Links Style Sheet JavaScript 1 default.css 4: JavaScript JavaScript NXJ JavaScript JavaScript JavaScript 2 JavaScript : JavaScript NXJ JavaScript Unify NXJ JavaScript 4

5 JavaScript : JavaScript NXJ JavaScript 3 JavaScript JavaBean JavaBean NXJ JavaScript BeanInfo BeanInfo NXJ JavaScript JavaScript 1: JavaScript 2: JavaBean 3: BeanInfo 4: 5: Unify NXJ JavaScript 5

6 1: JavaScript JavaScript div document.write div getvalue setvalue 1 true false getvalue/setvalue JavaScript 1. NXJ > JavaScript 2. Classes > JavaScript Field JavaScript Unify NXJ JavaScript 6

7 JavaScript JavaScript 3. JavaScript JavaScript NXJ JavaScript 1 div getvalue setvalue registercomponent registercomponent Unify NXJ JavaScript 7

8 4. JavaScript function Spinner(divName) { this.div = window.document.getelementbyid(divname); if (this.div) { this.div.getvalue = Spinner.prototype.getValue; this.div.setvalue = Spinner.prototype.setValue; this.div.entervalue = Spinner.prototype.enterValue; this.div.value = 0; // add other code to create the element var parentdiv; if (this.div.parentnode) parentdiv = this.div.parentnode; Unify NXJ JavaScript 8

9 else if (this.div.parentelement) parentdiv = this.div.parentelement; var divwidth = parentdiv.style.width.slice(0,-2); var index = document.images.length; document.write( <table cellpadding= 0 cellspacing= 0 border= 0 ><tr><td rowspan= 2 > ); document.write( <input style= float: left; width: + (divwidth - 11) + px type= text name= + divname + input id= + divname + input > ); document.write( </td><td> ); document.write( <a href= about:blank + onclick= document.images[ + index + ]._sp.onclickup(); return false; + onmousedown= document.images[ + index + ].src =../Static_Content/SpinnerUpPressed.png ; + onmouseup= document.images[ + index + ].src =../Static_Content/SpinnerUpUnpressed.png ; + onmouseout= document.images[ + index + ].src =../Static_Content/SpinnerUpUnpressed.png ; + id= + divname + up > ); document.write( <img src=../static_content/spinnerupunpressed.png + style= width: 11px; height: 11px; border: none > ); document.write( </a></td></tr><tr><td> ); document.write( <a href= about:blank + onclick= document.images[ + (index + 1) + ]._sp.onclickdown(); return false; + onmousedown= document.images[ + (index + 1) + ].src =../Static_Content/SpinnerDownPressed.png ; + onmouseup= document.images[ + (index + 1) + ].src =../Static_Content/SpinnerDownUnpressed.png ; + onmouseout= document.images[ + (index + 1) + ].src =../Static_Content/SpinnerDownUnpressed.png ; + id= + divname + down > ); document.write( <img src=../static_content/spinnerdownunpressed.png + style= width: 11px; height: 11px; border: none > ); document.write( </a></td></tr></table> ); document.images[index]._sp = this; document.images[index + 1]._sp = this; this.div.textfield = document.all[divname + input ]; Spinner.prototype.getValue = function() { return this.textfield.value; Spinner.prototype.setValue = function(value) { this.textfield.value = value; Spinner.prototype.enterValue = function() { // add code to get input value from the user // We are using a standard text field as the main object in our Unify NXJ JavaScript 9

// Javascript component, so this is not needed. Spinner.prototype.onClickUp = function() { this.div.textfield.value++; Spinner.prototype.onClickDown = function() { this.div.textfield.value--; 5.

10 // Javascript component, so this is not needed. Spinner.prototype.onClickUp = function() { this.div.textfield.value++; Spinner.prototype.onClickDown = function() { this.div.textfield.value--; 5. > JavaScript Java JavaScript NXJ 2: JavaBean JavaScript JavaBean JavaBean Swing getinstantiationcode JavaScrip getinstantiationcode bean 1 NXJ JavaBean Unify NXJ JavaScript 10

11 JavaBean package <package name of component>; import <name of base class's bean>; class <component name>bean extends < base class' bean> { JavaBean NXJ JavaBean JavaBean JavaBean Background Font JavaScript JavaBean BeanInfo JavaBean jbiz <div> <script language="javascript"> snippet returned by getinstantiationcode </script> </div> div Background Foreground Width Height NXJ getinstantiationcode $DIV div Unify NXJ JavaScript 11

12 3: BeanInfo BeanInfo JavaBean Java Beans BeanInfo JavaBeans 1 JavaScript NXJ BeanInfo JavaScript JavaScript BeanInfo NXJ BeanInfo BeanInfo BeanInfo NXJ BeanInfo BeanInfo bean Java bean JavaScript NXJ BeanInfo BeanInfo Static Content NXJ 3 Swing NXJ NXJ 4: JavaScript 1. NXJ JavaScript 2. Unify NXJ JavaScript 12

13 3. JavaScript 4. JavaBean JavaBean JavaBean JavaScript Background Font Component Properties BeanInfo BeanInfo NXJ BeanInfo JavaBean NXJ bean bean bean Unify NXJ JavaScript 13

14 JavaScript NXJ Target Field BeanInfo NXJ bean NXJ 5: Unify NXJ JavaScript 14

paper.pdf

paper.pdf Cop: Web 1,a) 1,b) GUI, UI,,., GUI, Java Swing., Web HTML CSS,. CSS,, CSS,.,, HTML CSS Cop. Cop, JavaScript,,. Cop, Web,. Web, HTML, CSS, JavaScript, 1., GUI, Web., HTML CSS (UI), JavaScript, Web GUI.