`
yangw1125
  • 浏览: 10548 次
  • 性别: Icon_minigender_2
  • 来自: 广州
社区版块
存档分类
最新评论

js onload image

阅读更多
//验证邮箱格式
function isEmail(strEmail) {
if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1) {
return true;
} else {
return false;
}
}


//Email验证
function checkEmail(a) {
return /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(a);
/*
var i=a.length;
var temp = a.indexOf('@');
var tempd = a.indexOf('.');
if (temp > 1)
  if ((i-temp) > 3)
   if ((i-tempd)>0)  return true;
return false;*/
}

//url校验
function isUrl(url) {
var urlpatern1 = /^https?:\/\/(([a-zA-Z0-9_-])+(\.)?)*(:\d+)?(\/((\.)?(\?)?=?&?[a-zA-Z0-9_-](\?)?)*)*$/i;
if (!urlpatern1.test(url)) {
return false;
}
return true;
}



// 电话号码验证
function isPhone(tel) {
var i, j, strTemp;
strTemp = "0123456789-()#+ ";
for (i = 0; i < tel.length; i++) {
j = strTemp.indexOf(tel.charAt(i));
if (j == -1) {
return false;
}
}
return true;
}
function checkPhone(tel) {
var patrn = /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/;
if (!patrn.exec(tel)) {  
           // errorinfo += "你输入的的客户经办人(2)固定电话格式不正确,请重新输入!n";  
return false;
} else {
return true;
}
}

//移动电话格式
function isMobile(mobile) {
//true 是移动电话
return mobile.match(/^(13[0-9]{9}|15[0-9]{9})$/);
}



//数值检测
function isNumber(name) {
if (name.length == 0) {
return false;
}
for (i = 0; i < name.length; i++) {
if (name.charAt(i) < "0" || name.charAt(i) > "9") {
return false;
}
}
return true;
}

//isNull
function isNull(str) {
if (str == null || str == "") {
return true;
}
var i = 0;
for (i = 0; i < str.length; i++) {
if (str.charAt(i) != " ") {
return false;
}
}
if (i == str.length) {
return true;
}
return false;
}

//英文值检测
function isEnglish(name) {
if (name.length == 0) {
return false;
}
for (i = 0; i < name.length; i++) {
if (name.charCodeAt(i) > 128) {
return false;
}
}
return true;
}
//中文值检测
function isChinese(name) {
if (name.length == 0) {
return false;
}
for (i = 0; i < name.length; i++) {
if (name.charCodeAt(i) > 128) {
return true;
}
}
return false;
}
//身份证验证
function isIDCar(str) {
var patrn = /^(([0-9]{14}[x0-9]{1})|([0-9]{17}[x0-9]{1}))$/;
if (!patrn.exec(str)) {  
          //var errorinfo = "你输入法人代表的身份证号码格式不正确,请输入15位或者18位的身份证号码!n";
return false;
} else {
return false;
}
}

//是非负浮点数字则返回true,否则返回false
function floatChecked(str) {
if (!isNull(str)) {
var re = /^[0-9]\d*\.\d*$/;
return re.test(str);
}else{
  return true;
}
}
//非负整数则返回true,否则返回false
function intChecked(str) {
if (!isNull(str)) {
var re = /^[1-9]\d*$/;
return re.test(str);
}else{
  return true;
}
}




/---------------------


DATE_FORMAT(o.addtime,'%Y-%m-%d') 

/--------------------



function imageShow(image,w,h){

var i=image.width;
var j=image.height;
if(i>w)//实际宽度大于显示的
{
var width_Bili=w/i;//缩小的比列
var height_Bili=h/j;//缩小的比列

var bili=width_Bili;
if(width_Bili<height_Bili)
{
bili=width_Bili;
}
else
{
bili=height_Bili;
}
i=i*bili;
j=j*bili;
}else//实际宽度小于显示的
{
if(j>h)//实际高度大于显示的高度,就要缩
{
bili=h/j;
i=i*bili;
j=j*bili;
}

}

image.width=i;
image.height=j;
}


<!---------move div-------------->


var posX;
var posY;      
var fdiv = document.getElementById("dingwei");          
document.getElementById("title").onmousedown=function(e)
{
    if(!e) e = window.event;  //如果是IE
    posX = e.clientX - parseInt(fdiv.style.left);
    posY = e.clientY - parseInt(fdiv.style.top);
    document.onmousemove = mousemove;          
}
document.onmouseup = function()
{
    document.onmousemove = null;
}
function mousemove(ev)
{
    if(ev==null) ev = window.event;//如果是IE
    fdiv.style.left = (ev.clientX - posX) + "px";
    fdiv.style.top = (ev.clientY - posY) + "px";
}


<div id="dingwei" style="display: none; position: absolute; left: 200px; top: 200px; width: 393; height: 160; z-index: 1; background-color: #FFFFFF; border: solid 1px #CCCCCC;">
<div id="title" style="PADDING-LEFT: 10px; FONT-SIZE: 13px; CURSOR: move; COLOR: #fff; PADDING-TOP: 5px; HEIGHT: 20px; BACKGROUND-COLOR: blue">
xxxxxxxx
</div>
<div>


<!----------------------position x,y------------------------>

    var e = e||window.event;
    var objSrc = e.srcElement;//event source element
    var left = 0;
    var top  = 0;
    while (objSrc.offsetParent){
        left += objSrc.offsetLeft;
        top  += objSrc.offsetTop;
        objSrc    = objSrc.offsetParent;
    }
    left += objSrc.offsetLeft;//source element's offsetTop
    top  += objSrc.offsetTop;//source element's offsetLeft

    mouseOffsetX = left + e.offsetX;

    mouseOffsetY = top + e.offsetY;



<!-------------------------------     ----------------------->

   function set_imgurl_id(path){
    document.getElementById('imgurl_id').innerHTML="";//初始化为空
   var newPreview = document.getElementById('imgurl_id');           
  
          
           
           
   if(path==null||path==""){
   
    //document.getElementById(id_).innerHTML="<img src='<%=path%>/user/images/001.jpg'/>";
    newPreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = "<%=path%>/productimg/${product.imgurl}";
    newPreview.style.width = "55px";
    newPreview.style.height = "55px";
  
   }else{
   
  
//value=value.replace(/\\/g,'/');

  //  document.getElementById(id_).innerHTML="<img src='"+value+"' border='12' width='53' height='53'>";
            newPreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = path;
           newPreview.style.width = "55px";
           newPreview.style.height = "55px";
   }
  
   }

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);




分享到:
评论

相关推荐

    js的image onload事件使用遇到的问题

    标题中所提到的知识点是“js的image onload事件使用遇到的问题”,这涉及到JavaScript中Image对象的onload事件处理。在Web前端开发中,onload事件是一个非常重要的概念,主要用于处理图片或者其他资源加载完成后的...

    Javascript for Image process

    1. 加载图片:使用`new Image()`创建一个图片对象,设置其`src`属性为图片URL,然后在其`onload`事件中处理图片。 2. 绘制图片:在Canvas上使用`drawImage()`方法绘制图片,可以指定绘制的区域和位置。 3. 用户交互...

    JavaScript与Image加载事件(onload)、加载状态(complete)

    JavaScript中的Image对象是一个强大的工具,用于处理图像加载和显示。在网页开发中,我们经常需要动态加载图片,这时就需要利用到Image对象的加载事件(onload)和加载状态(complete)属性。这两个特性可以帮助我们...

    js 实现图片预加载(js操作 Image对象属性complete ,事件onload 异步加载图片)

    – function addImg(isrc) { var Img = new Image(); Img.src = isrc; Img.onload = function () { document.body.appendChild(Img); } } //–&gt; [removed] 当包含上述代码的页面打开时并不载入 “tt.jpg” ,当点击...

    js 利用image对象实现图片的预加载提高访问速度

    1. 使用JavaScript创建Image对象:通过JavaScript创建一个新的Image对象,并通过设置这个对象的src属性为所需预装载图片的URL,可以实现图片的预加载。当图片加载完成后,会触发onLoad事件,表示图片已经被成功缓存...

    js获取 input file 图片立即显示

    "js获取input file 图片立即显示"这个话题就是关于如何利用JavaScript来实现在用户选择图片后即时预览的功能。以下是一个详尽的步骤解释和相关知识点: 1. **HTML 结构**: 首先,我们需要在HTML页面中创建一个`...

    img的onload的另类用法

    &lt;img src="image.jpg" onload="alert('图片加载完成!')"&gt; ``` 在上面的示例中,我们使用img的onload事件来判断图片是否加载完成。当图片加载完成时,onload事件将被触发,从而执行alert函数。 此外,我们还可以...

    Changing Image Source in Javascript.zip

    在JavaScript编程中,改变图像(image)的源(source)是一项常见的任务,特别是在制作交互式网页游戏时。这个“Changing Image Source in Javascript.zip”压缩包很可能包含了一个或多个示例,教你如何在JavaScript...

    jquery.imgGetSize:在图片onload之前获取图片的大小

    image-size使用该插件,可以在图片onload之前获取图片的大小,在瀑布流布局中,应该可能会有用处。###实现原理:使用轮询,在图片onload之前,获取到图片大小。如果图片已经被缓存过,直接返回相关信息。回调参数...

    js中Image对象以及对其预加载处理示例

    在JavaScript编程中,Image对象是一个常用的内置对象,通常用于在网页中加载和显示图片。而图片预加载是网页性能优化的一个重要方面,尤其在涉及到动态更换图片的场景中。预加载可以减少用户在交互时感受到的延迟,...

    JavaScript Image对象实现原理实例解析

    JavaScript中的Image对象是用于处理和操作图像的核心组件,它在网页动态加载和处理图像时扮演着重要角色。Image对象不仅可以用于在HTML中显示图像,还可以在JavaScript中预先加载图像,以便在需要时快速显示,避免...

    js自动修改图片尺寸

    &lt;img src="example.jpg" onload="javascript:DrawImage(this, 100, 100);" /&gt; ``` #### 四、注意事项 - **兼容性问题**:不同浏览器对于图片尺寸调整的支持情况可能不同,需要注意测试兼容性。 - **性能考虑**:...

    IE9浏览器下 使用JS获取图片尺寸大小 的方法

    总结来说,在IE9浏览器中获取图片尺寸,我们需要利用`Image`对象的`onload`事件来确保在正确的时间获取到正确的尺寸。这种方法不仅可以避免在图片未加载完成时获取错误的尺寸,还能处理图片加载失败的情况。通过上述...

    cropper图片裁剪.7z

    3. 初始化cropper:在JavaScript中,通过`$(document).ready()`或`window.onload`确保DOM加载完成,然后初始化cropper对象。 ```javascript var $image = $('#image'); $image.cropper({ aspectRatio: 1, // 设置...

    基于JS2Image实现圣诞树代码

    在给定的文件内容中,主题是通过使用js2image工具来将JavaScript代码压缩并展示成圣诞树的ASCII字符画。这里涉及到的技术点包括JavaScript编程、字符画生成、以及HTML中的图像对象的使用。 1. **JavaScript编码与...

    vanilla-image-cropper:轻量级香草js图像裁剪器,零依赖要求

    使用Vanilla js编写的轻量级javascript imagecropper,具有零依赖注入功能,可将其自身构建到对象中。 有关实时预览和一些示例代码,请访问 入门 var img_c = new ImageCropper ( parent , image , options ) ; ...

    JS实现图片预加载

    JS 实现图片预加载可以通过使用 Image 对象来实现图片的预下载,并且可以结合容器的宽和高,按照一定的缩放比例使图片显示出来。 在实现图片预加载时,需要考虑到图片的宽和高,这可以通过 Image 对象的 width 和 ...

Global site tag (gtag.js) - Google Analytics