- 浏览: 2492559 次
- 性别:
- 来自: 成都
文章分类
最新评论
-
nation:
你好,在部署Mesos+Spark的运行环境时,出现一个现象, ...
Spark(4)Deal with Mesos -
sillycat:
AMAZON Relatedhttps://www.godad ...
AMAZON API Gateway(2)Client Side SSL with NGINX -
sillycat:
sudo usermod -aG docker ec2-use ...
Docker and VirtualBox(1)Set up Shared Disk for Virtual Box -
sillycat:
Every Half an Hour30 * * * * /u ...
Build Home NAS(3)Data Redundancy -
sillycat:
3 List the Cron Job I Have>c ...
Build Home NAS(3)Data Redundancy
HTML5(五) Picture and Text
1. image object
Image is for a picture, we have many ways to get a image object.
a. document.images array
b. document.getElementsByTagName or document.getElementById
c. create a new Image object, and set a picture URL
var img = new Image();
img.src = 'my_image.png';
d. data:url
encode all the picture data via BASE64 to /9j/4QDfRXhpZgAASUkqAAgAAAAFABIBAwABAAAAAQAAADEBAgAVAAAASgAAADIBAgAUAAAAXw
and put them all in the html
2. drawing object
drawImage(image,x,y)
(x,y) is the left top point of the picture, it decides the postion
my example of the small picture, test5.html:
<canvas id="canvas1" width="250" height="300" style="background-color:black">
you are out!
</canvas><br/>
<input type="button" value="show the girl" onclick="Show();" />
<input type="button" value="hide" onclick="Clear();" />
<script type="text/javascript">
//picture data Base64 encode
IMG_SRC='data:image/gif;base64,/9j/4QDfRXhpZgAASUkqAAgAAAA......'//省略40字节
//small
IMG_SRC_SMALL='data:image/gif;base64,/9j/4QDfRXhpZgAASUkqAAgAAAAFABIBAwABAAAAAQAAADEBAgAVAAAASgAAADIBAgAUAAAAXwAAABMCAwABAAAAAQAAAGmHBAABAAAAcwAAAAAAAABBQ0QgU3lzdGVtcyDK/cLrs8nP8QAyMDEwOjEwOjA0IDE1OjM5OjU3AAUAAJAHAAQAAAAwMjIwkJICAAQAAAAyODEAAqAEAAEAAAAXAAAAA6AEAAEAAAAeAAAABaAEAAEAAAC1AAAAAAAAAAIAAQACAAQAAABSOTgAAgAHAAQAAAAwMTAwAAAAAAAAAAD//gAqSW50ZWwoUikgSlBFRyBMaWJyYXJ5LCB2ZXJzaW9uIDEsNSw0LDM2AP/AABEIAB4AFwMBIQACEQEDEQH/2wCEAAMCAgICAQMCAgIDAwMDBAcEBAQEBAkGBgUHCgkLCwoJCgoMDREODAwQDAoKDxQPEBESExMTCw4VFhUSFhESExIBBAUFBgUGDQcHDRsSDxIbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbG//EAIgAAAIDAQAAAAAAAAAAAAAAAAUGBwgJBBAAAQMDAgQBCgcBAAAAAAAAAQIDBAUGEQcSAAghMRMJFRYiQVRhcZGUFBcyUVWB0eEBAQEBAQAAAAAAAAAAAAAAAAYHBQQRAAEEAQAHCAMAAAAAAAAAAAEAAgMRBBITMVFhcYEFISIkMjNB8LHR4f/aAAwDAQACEQMRAD8AtfYlwW1qbYUkTNE4k2lUxDbVClQ58eYanDypKnkltYLbfjoeSUEk5T6w6jgNp7YGoz/MnXo1w2LaVJsJhC0UZMWoOGoNOJWnHiIUpQUhaSpQIxjABA7cc2LK+OYn6Vo5Fy4mqkcaGwbj+vhSTWNPLaZjeNNfpqADtxIl4P8AScDpwH9CrI97oX3H/eErc6au4noEUdhQ34gL4lVCrKh5N/nfmNWRIq9wW1eVCefg0qZODrkaW2vOCdoCkFRO4pCVbVZG5ScKbbEvOu8y/KzqDOra49Oq9Iq8avR/Msh4luGWdjrKXF+uQnIWc9Tk+zGJ7nSPjx3vb6qNc6P5pL5vZNbv6otqlFp8CMtlL0ybtIy2uSp109sqGTn58CPwkH+Eqf0X/vAeHtrOcyy4dUd1pGwJz5/zXa3ymWvcEugh5yLV5C5sx57wHQXUJUhtsfrUnc25lI6AAE9s8C/J8sah2TpTfGqFQsBNctmt0dwiSZhaciNoCwtsJ2HcHAUnuQPDPbPFBvyhdVn6UmkBLzupJV3XpT4lPkLDzfjIebjMpaG9SlbN6s46429vkeE/8wnv2e+3XxP8bBLo7KLFhtaQ6rW9pPq/XKZbWoVjIrMGjvprqmHlbW3HglSMkJPrdCcg4Cvb8TerWpkKwOUG4G7NoEeKmLT10+JF8JLccLWnYjKU9AhO7sAc9uKA0yNiJJSeRzaHAXzWW9VtqsrqjTPnCOXlxkokK2kJXs6dMDoSrrn4444/Q2r+/RvqvjKbjaLQEf0Sv//Z';
function Show(){
ctx = document.getElementById("canvas1").getContext("2d");
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0);
}
img.src=IMG_SRC_SMALL;
}
function Clear(){
ctx = document.getElementById("canvas1").getContext("2d");
ctx.clearRect(0,0,250,300);
}
</script>
3. enlarge and make it small
drawImage(image,x,y,width,height)
my test page is test5-1.html:
<canvas id="canvas2" width="250" height="300" style="background-color:black">
you are out
</canvas><br/>
horizontal<input type="range" min="1" max="200" onchange="Scale1(event)"/><br/>
vertical<input type="range" min="1" max="200" onchange="Scale2(event)"/><br/>
percent<input type="range" min="1" max="200" onchange="Scale3(event)"/><br/>
tile<input type="range" min="1" max="100" value="1" onchange="Scale4(event)"/><br/>
<script type="text/javascript">
function Scale1(){
//caculate
var scale=event.target.value/10
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0,img.width*scale,img.height);
}
img.src=IMG_SRC_SMALL;
}
function Scale2(){
var scale=event.target.value/10
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0,img.width,img.height*scale);
}
img.src=IMG_SRC_SMALL;
}
function Scale3(){
var scale=event.target.value/10
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0,img.width*scale,img.height*scale);
}
img.src=IMG_SRC_SMALL;
}
function Scale4(){
var scale=event.target.value;
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
var n1=img.width/scale;
var n2=img.height/scale;
for(var i=0;i<n1;i++)
for(var j=0;j<n2;j++)
ctx.drawImage(img,i*img.width/scale,j*img.height/scale,img.width/scale,img.height/scale);
}
img.src=IMG_SRC_SMALL;
}
</script>
4. cut the image
drawImage(image,sx,sy,sWidth,sHeight,dx,dy,dWidth,dHeight)
(sx,sy) the start point of the cut picture
sWidth and sHeight are the width and height of the cut picture.
(dx,dy) the start point of the output picture
dWidth and dHeight are the width and height of the output picture.
5. Image
createPattern(image,type)
type: repeat, repeat-x, repeat-y, no-repeat
my example file is test5-2.html:
<canvas id="canvas3" width="250" height="300" style="background-color:black">
you are out!
</canvas><br/>
<input type="button" value="Go" onclick="Patterns();" />
<input type="button" value="Clear" onclick="ClearPatterns();" />
<script type="text/javascript">
function Patterns(){
ctx = document.getElementById("canvas3").getContext("2d");
img=new Image();
img.src=IMG_SRC_SMALL;
img.onload=function(){
var ptrn = ctx.createPattern(img,'repeat');
ctx.fillStyle = ptrn;
ctx.fillRect(0,0,250,300);
}
}
function ClearPatterns(){
ctx = document.getElementById("canvas3").getContext("2d");
ctx.clearRect(0,0,250,300);
}
</script>
6.Text
font: text style, it is like font-family in CSS
textAlign: start, end, left, right, center, default value is start.
textBaseline: top, hanging, middle, alphabetic, ideographic, bottom. default value is alphabetic.
fillText
strokeText
my example file is test5-3.html:
<canvas id="canvas3" width="250" height="300" style="background-color:black">
you are out!
</canvas><br/>
<input type="button" value="Show" onclick="Show();" />
<input type="button" value="Clear" onclick="ClearPatterns();" />
<script type="text/javascript">
function Show(){
ctx = document.getElementById("canvas3").getContext("2d");
ctx.fillStyle = 'white';
ctx.font = 'italic 30px sans-serif';
ctx.textBaseline = 'top';
ctx.fillText('Hello world1!', 0, 0);
ctx.font = 'italic 30px sans-serif';
ctx.fillText('Hello world2!', 0, 50);
}
function ClearPatterns(){
ctx = document.getElementById("canvas3").getContext("2d");
ctx.clearRect(0,0,250,300);
}
</script>
references:
http://www.blogjava.net/myqiao/category/46360.html
1. image object
Image is for a picture, we have many ways to get a image object.
a. document.images array
b. document.getElementsByTagName or document.getElementById
c. create a new Image object, and set a picture URL
var img = new Image();
img.src = 'my_image.png';
d. data:url
encode all the picture data via BASE64 to /9j/4QDfRXhpZgAASUkqAAgAAAAFABIBAwABAAAAAQAAADEBAgAVAAAASgAAADIBAgAUAAAAXw
and put them all in the html
2. drawing object
drawImage(image,x,y)
(x,y) is the left top point of the picture, it decides the postion
my example of the small picture, test5.html:
<canvas id="canvas1" width="250" height="300" style="background-color:black">
you are out!
</canvas><br/>
<input type="button" value="show the girl" onclick="Show();" />
<input type="button" value="hide" onclick="Clear();" />
<script type="text/javascript">
//picture data Base64 encode
IMG_SRC='data:image/gif;base64,/9j/4QDfRXhpZgAASUkqAAgAAAA......'//省略40字节
//small
IMG_SRC_SMALL='data:image/gif;base64,/9j/4QDfRXhpZgAASUkqAAgAAAAFABIBAwABAAAAAQAAADEBAgAVAAAASgAAADIBAgAUAAAAXwAAABMCAwABAAAAAQAAAGmHBAABAAAAcwAAAAAAAABBQ0QgU3lzdGVtcyDK/cLrs8nP8QAyMDEwOjEwOjA0IDE1OjM5OjU3AAUAAJAHAAQAAAAwMjIwkJICAAQAAAAyODEAAqAEAAEAAAAXAAAAA6AEAAEAAAAeAAAABaAEAAEAAAC1AAAAAAAAAAIAAQACAAQAAABSOTgAAgAHAAQAAAAwMTAwAAAAAAAAAAD//gAqSW50ZWwoUikgSlBFRyBMaWJyYXJ5LCB2ZXJzaW9uIDEsNSw0LDM2AP/AABEIAB4AFwMBIQACEQEDEQH/2wCEAAMCAgICAQMCAgIDAwMDBAcEBAQEBAkGBgUHCgkLCwoJCgoMDREODAwQDAoKDxQPEBESExMTCw4VFhUSFhESExIBBAUFBgUGDQcHDRsSDxIbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbG//EAIgAAAIDAQAAAAAAAAAAAAAAAAUGBwgJBBAAAQMDAgQBCgcBAAAAAAAAAQIDBAUGEQcSAAghMRMJFRYiQVRhcZGUFBcyUVWB0eEBAQEBAQAAAAAAAAAAAAAAAAYHBQQRAAEEAQAHCAMAAAAAAAAAAAEAAgMRBBITMVFhcYEFISIkMjNB8LHR4f/aAAwDAQACEQMRAD8AtfYlwW1qbYUkTNE4k2lUxDbVClQ58eYanDypKnkltYLbfjoeSUEk5T6w6jgNp7YGoz/MnXo1w2LaVJsJhC0UZMWoOGoNOJWnHiIUpQUhaSpQIxjABA7cc2LK+OYn6Vo5Fy4mqkcaGwbj+vhSTWNPLaZjeNNfpqADtxIl4P8AScDpwH9CrI97oX3H/eErc6au4noEUdhQ34gL4lVCrKh5N/nfmNWRIq9wW1eVCefg0qZODrkaW2vOCdoCkFRO4pCVbVZG5ScKbbEvOu8y/KzqDOra49Oq9Iq8avR/Msh4luGWdjrKXF+uQnIWc9Tk+zGJ7nSPjx3vb6qNc6P5pL5vZNbv6otqlFp8CMtlL0ybtIy2uSp109sqGTn58CPwkH+Eqf0X/vAeHtrOcyy4dUd1pGwJz5/zXa3ymWvcEugh5yLV5C5sx57wHQXUJUhtsfrUnc25lI6AAE9s8C/J8sah2TpTfGqFQsBNctmt0dwiSZhaciNoCwtsJ2HcHAUnuQPDPbPFBvyhdVn6UmkBLzupJV3XpT4lPkLDzfjIebjMpaG9SlbN6s46429vkeE/8wnv2e+3XxP8bBLo7KLFhtaQ6rW9pPq/XKZbWoVjIrMGjvprqmHlbW3HglSMkJPrdCcg4Cvb8TerWpkKwOUG4G7NoEeKmLT10+JF8JLccLWnYjKU9AhO7sAc9uKA0yNiJJSeRzaHAXzWW9VtqsrqjTPnCOXlxkokK2kJXs6dMDoSrrn4444/Q2r+/RvqvjKbjaLQEf0Sv//Z';
function Show(){
ctx = document.getElementById("canvas1").getContext("2d");
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0);
}
img.src=IMG_SRC_SMALL;
}
function Clear(){
ctx = document.getElementById("canvas1").getContext("2d");
ctx.clearRect(0,0,250,300);
}
</script>
3. enlarge and make it small
drawImage(image,x,y,width,height)
my test page is test5-1.html:
<canvas id="canvas2" width="250" height="300" style="background-color:black">
you are out
</canvas><br/>
horizontal<input type="range" min="1" max="200" onchange="Scale1(event)"/><br/>
vertical<input type="range" min="1" max="200" onchange="Scale2(event)"/><br/>
percent<input type="range" min="1" max="200" onchange="Scale3(event)"/><br/>
tile<input type="range" min="1" max="100" value="1" onchange="Scale4(event)"/><br/>
<script type="text/javascript">
function Scale1(){
//caculate
var scale=event.target.value/10
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0,img.width*scale,img.height);
}
img.src=IMG_SRC_SMALL;
}
function Scale2(){
var scale=event.target.value/10
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0,img.width,img.height*scale);
}
img.src=IMG_SRC_SMALL;
}
function Scale3(){
var scale=event.target.value/10
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
ctx.drawImage(img,0,0,img.width*scale,img.height*scale);
}
img.src=IMG_SRC_SMALL;
}
function Scale4(){
var scale=event.target.value;
ctx = document.getElementById("canvas2").getContext("2d");
ctx.clearRect(0,0,250,300);
img=new Image();
img.onload=function(){
var n1=img.width/scale;
var n2=img.height/scale;
for(var i=0;i<n1;i++)
for(var j=0;j<n2;j++)
ctx.drawImage(img,i*img.width/scale,j*img.height/scale,img.width/scale,img.height/scale);
}
img.src=IMG_SRC_SMALL;
}
</script>
4. cut the image
drawImage(image,sx,sy,sWidth,sHeight,dx,dy,dWidth,dHeight)
(sx,sy) the start point of the cut picture
sWidth and sHeight are the width and height of the cut picture.
(dx,dy) the start point of the output picture
dWidth and dHeight are the width and height of the output picture.
5. Image
createPattern(image,type)
type: repeat, repeat-x, repeat-y, no-repeat
my example file is test5-2.html:
<canvas id="canvas3" width="250" height="300" style="background-color:black">
you are out!
</canvas><br/>
<input type="button" value="Go" onclick="Patterns();" />
<input type="button" value="Clear" onclick="ClearPatterns();" />
<script type="text/javascript">
function Patterns(){
ctx = document.getElementById("canvas3").getContext("2d");
img=new Image();
img.src=IMG_SRC_SMALL;
img.onload=function(){
var ptrn = ctx.createPattern(img,'repeat');
ctx.fillStyle = ptrn;
ctx.fillRect(0,0,250,300);
}
}
function ClearPatterns(){
ctx = document.getElementById("canvas3").getContext("2d");
ctx.clearRect(0,0,250,300);
}
</script>
6.Text
font: text style, it is like font-family in CSS
textAlign: start, end, left, right, center, default value is start.
textBaseline: top, hanging, middle, alphabetic, ideographic, bottom. default value is alphabetic.
fillText
strokeText
my example file is test5-3.html:
<canvas id="canvas3" width="250" height="300" style="background-color:black">
you are out!
</canvas><br/>
<input type="button" value="Show" onclick="Show();" />
<input type="button" value="Clear" onclick="ClearPatterns();" />
<script type="text/javascript">
function Show(){
ctx = document.getElementById("canvas3").getContext("2d");
ctx.fillStyle = 'white';
ctx.font = 'italic 30px sans-serif';
ctx.textBaseline = 'top';
ctx.fillText('Hello world1!', 0, 0);
ctx.font = 'italic 30px sans-serif';
ctx.fillText('Hello world2!', 0, 50);
}
function ClearPatterns(){
ctx = document.getElementById("canvas3").getContext("2d");
ctx.clearRect(0,0,250,300);
}
</script>
references:
http://www.blogjava.net/myqiao/category/46360.html
发表评论
-
MongoDB 2019(3)Security and Auth
2019-11-16 06:48 207MongoDB 2019(3)Security and Aut ... -
Memory Leak in NodeJS
2018-12-20 06:26 695Memory Leak in NodeJS I have d ... -
Remote Desktop Client
2018-12-07 13:19 1155Remote Desktop Client There is ... -
MetaBase UI Console(2)Docker on MySQL
2018-11-29 06:58 905MetaBase UI Console(2)Docker on ... -
AWS Lambda and Serverless Timeout
2018-09-20 01:20 601AWS Lambda and Serverless Timeo ... -
2018 WebSocket(1)Introduction
2018-03-20 01:22 10782018 WebSocket(1)Introduction ... -
2018 TypeScript Update(3)Introduction Basic Grammar
2018-03-08 03:08 5712018 TypeScript Update(3)Introd ... -
2018 TypeScript Update(2)Introduction Basic Grammar - Classes and Functions
2018-03-06 05:32 5222018 TypeScript Update(2)Introd ... -
2018 TypeScript Update(1)Introduction Basic Grammar - Types and Interface
2018-03-03 01:15 5762018 TypeScript Update(1)Introd ... -
Charts and Console(6)Paging
2018-03-01 00:12 558Charts and Console(6)Paging Th ... -
Vue.JS(3)Google Login
2018-02-14 04:53 1243Vue.JS(3)Google Login I just p ... -
Vue.JS(2)Monitor Water Console - ChartJS and Axios
2018-02-14 03:17 693Vue.JS(2)Monitor Water Console ... -
Vue.JS(1)Introduction and Basic Demo
2018-02-08 06:47 577Vue.JS(1)Introduction and Basic ... -
Charts and Console(5)Validation Form
2017-10-03 05:12 775Charts and Console(5)Validation ... -
Charts and Console(4)Display and Enhancement
2017-09-20 05:39 605Charts and Console(4)Display an ... -
Charts and Console(3)Auth and Login
2017-09-13 03:45 630Charts and Console(3)Auth and L ... -
Charts and Console(2)Login and Proxy
2017-08-31 05:39 849Charts and Console(2)Login and ... -
Charts and Console(1)UI Console and RESTful Client
2017-08-29 11:02 740Charts and Console(1)UI Console ... -
Blog Project(2)Express Backend API - istanbul - mocha - bunyan
2017-06-09 00:05 449Blog Project(2)Express Backend ... -
ReactJS(5)Composition vs Inheritance
2017-06-06 05:55 1078ReactJS(5)Composition vs Inheri ...
相关推荐
text background color, numeric items, symbol items, decrease indent, increase indent, align left, align center, align right, add hyperlink, remove hyperlink, add image, insert horizontal line, set and...
With adRevenue, you or your advertisers can start serving and managing Text Ads, Banners, Picture+Text Ads and Freeform HTML in multiple zones on your website in no time at all. Profit from the hard ...
FastReport.v4.15 for.Delphi.BCB.Full.Source企业版含ClientServer中文修正版支持Delphi 4-XE5 and C++Builder 6-XE5. D2010以上版本(D14_D19)安装必读 delphi2010以上版本(D14_D19)使用者安装时,请将res\frccD14_...
A larger example, a Web database of frequently asked questions (FAQs), demonstrates the big picture with JSPs and beans. Final chapters turn toward a useful aspect of JSP, custom tags, which allow ...
that scrolls text<END><br>81,mtymse.zip This is a control (VB5 with source) that controls every aspect of the mouse<END><br>82,progbar.zip Uses a picture box to emulate a progress bar<END><br>83...
When you find a web site that you would like to use, copy and paste its URL into a text file (You can use Notepad as your text editor) instead of retyping the URL. This approach saves time and reduces...
So 下载 the code and get involved with the News Group, help us to help you.<END><br>4 , urllink.zip User control to launch web browser and jump to URL.<END><br>5 , vbftp.zip Sample application ...
start your Visual Basic program with your project code showing, right click and you should see "Rem Builder".<END><br>3 , syntax.zip This is an excellent example of how to highlight HTML code in a...
Optimizing for text and mobile browsers 140 The new mobile Safari browser 141 Summary 141 Chapter 5: Putting Your Theme into Action 143 A picture's worth 143 Theme packaging basics 145 ...
It allows you to drag and drop text, html & rtf files onto the executable and it will create the files in the correct format.<END><br>41,randomchars.zip This set of routines and sample project ...
Wide range of objects that can be used in a report: text, picture, lines, shapes, charts, barcodes, cross-table, ole object, richtext, checkbox, gradient. screenshot Visual report designer supports ...
ASCII Art Generator is an amazing graphics art to text art solution, which allows you to convert digital pictures into full color text-based images easily and quickly. You can input any message you’d...
• Recolor picture, Light and Contrast, transparent PNG support. • Opened the Shape Sheet for senior users to create more complicated shapes. • More 2000 clip arts. • Improved the Insert Hyperlink ...
Users can take a picture of cleaned up bed and get rewarded3. Users can create their own profiles and view points earned by their peers.4. Users can either send email or text reiminders to do the ...
echo '$imgLoc.'" alt="This is a captcha-picture. It is used to prevent mass-access by robots." title=""> '."\n"; echo '$_SERVER['PHP_SELF'].'" method="POST">'."\n"; echo '$imgLoc.'">'."\n"; ...
picture postcard showing the area you live in and some beautiful stamps for my kids who are stamp collectors. Do not use an envelop, I collect USED postcards sent to me. Write on the postcard that it ...
You may choose to open the Word document manual and save it as “Web File” as the picture showing below. Please note: Do not save it as “Single File Web Page” or “Web Page, Filtered”. Then you ...
Step 1: PHP and HTML 244 Step 2: The CSS 245 Step 3: Optional JavaScript 246 How it works 247 There's more... 247 Creating a horizontal drop-down menu 247 Adding a breadcrumb to your theme 250 ...
-h/--help Show this help text and exit -V/--version Show version info and exit Output Options: -o/--output <filename> Bitstream output file name --log-level <string> Logging level: none error ...
<input type=text name=text1 value="123" onfocus="this.select()"> ENTER键可以让光标移到下一个输入框 (event.keyCode==13)event.keyCode=9"> 文本框的默认值 <input type=text value="123" onfocus="alert...