Common JS, solve textarea, picture preview, wait to load

Source: Internet
Author: User

/*
* Resolve the data entered in the textarea to the database and read to the page no Line wrapping effect
* Textarea_info is the class displayed in the page content area
* How to use: Add class= "Textarea_info" directly to the corresponding area
* TEXTAREA_BR () can be called in JS.
* */
function Textarea_br () {
var element = $ (". Textarea_info");
Element.each (function () {
var temp = $ (this). Text (). replace (/\n/g, ' <br/> ');
$ (this). HTML (temp);
});
}

/*
* Loading Issues
*load_img is the class that loads the picture
* How to use: 1. Page reference
* Top of 2.js call Waiting_load ()
* 3. Call $interval = Window.setinterval (img_load, 100) where you need to wait for the reminder to be loaded;
* */
function Waiting_load () {
$ ('. Load_img '). CSS (' Display ', ' none ');
var num=1;
function Img_load () {
if ($ ('. Load_img '). CSS (' display ') = = ' None ') {
$ ('. Load_img '). CSS (' Display ', ' block ');
}
num++;
$ ('. Load_img '). CSS ({
"Transform": "Rotate (" +num*20+ "deg)",
"-ms-transform": "Rotate (" +num*20+ "deg)",
"-moz-transform": "Rotate (" +num*20+ "deg)",
"-webkit-transform": "Rotate (" +num*20+ "deg)",
"-o-transform": "Rotate (" +num*20+ "deg)"
});
var now_url = window.location.href;
if (num==100) {
Window.clearinterval ($interval);
Alert (' Pro, your net is too jammed ');
}
}
}


/*
* Image Preview
* Image_preview is the area ID where the preview image is placed
* Upload_input is the ID of the input that uploaded the image
* Img_upload_info is the ID of the message prompt message box
* How to use: Add Id= "Upload_input" and then bind onchange= "Preview" in the upload image input
*
* */
function Preview (file)
{
var prevdiv = document.getElementById (' Image_preview ');
var imgsize=file.files[0].size;
if (imgsize>1000000) {
Layer.alert (' Picture is too large, please select a picture less than 1M ');
document.getElementById (' Upload_input '). value= ';
document.getElementById (' Img_upload_info '). Innerhtml= ' * Picture is too large, please adjust and re-upload ';
}else if (file.files && file.files[0])
{
var reader = new FileReader ();
Reader.onload = function (evt) {
prevdiv.innerhtml = ' ';
}
Reader.readasdataurl (File.files[0]);
}
Else
{
prevdiv.innerhtml = ' <div class= ' img ' style= ' width:180px;height:250px;filter:progid:d XImageTransform.Microsoft.AlphaImageLoader (sizingmethod=scale,src=\ ' + file.value + ' \ ' "></div>";
}
}


Common JS, solve textarea, picture preview, wait to load

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.