Archive

Archive for the ‘Javascript’ Category

解决javascript动态改变img的src属性图片不显示问题

首先讲下这个bug的出现的情况:页面中有

<a href="javascript:void(0)" onclick="document.getElementById('current').src=‘images/001.jpg’;“>

这么一个a标签,onclick中的JS代码就是改变id为current的img标签的src属性,以达到动态切换图片的效果。

可是不幸的是:IE6(其他浏览器正常)是动态改变的图片的路径,但是图片却不显示出来,得右键“显示图片”才能看到改变后的图片,不知是什么原因。

道听途说:据说是<a href=”javascript:void(0)”>或者<a href=”#”>这样使用a标签的话并不能阻止a标签最后触发一个什么行为,导致ie6会错误的认为页面刷新或者重定向了,并且中断了当前所有连接,这样新图片的加载就被aborted了(不知真假,不过看起来蛮专业的)。

不管原因是真是假,下面就先说下解决方案吧,简单的解决方法:

<a href="javascript:void(0)" onclick="document.getElementById('current').src=‘images/001.jpg’; return false;“>;

就是在代码后面加上return false;即可

(有网友说将return flase; 改为 void(0); 也可,经本人试验不通过,希望更多网友分享自己的好方法)

其实这是自己以前在博客园中写的篇文章(看到自己的博文能够帮助到别人真的很开心,嘎嘎……),现在就移植过来了,分享一下

对象的传递

摘自《Javascript – The great part》一书中的“3.4 引用”。

对象是通过引用来传递的,它们永远不会被拷贝

var x = stooge;
x.nickname = 'Curly';
//因为x和stooge是指向同一个对象的引用,所以nick为'Curly'
var nick = stooge.nickname;
//a、b和c每个都引用一个不同的空对象
var a = {}, b = {}, c = {};
//a、b和c都引用同一个空对象
a = b = c = {};
分类: Javascript 标签:,

missing ( before formal parameters

本文系转载,原文地址:http://juztinwilzon.blogspot.com/2008/05/missing-before-formal-parameters.html,因为blogspot被和谐,加上发表的一篇“针对Firefox的javascript兼容性”中提到此问题,特在些将其作者的详解在此转载一下。

原文如下:
阅读更多…

分类: 转载, Javascript 标签:,

针对Firefox的javascript兼容性

今天在帮朋友修改一个项目后台时,发现他们原先的后台在Firefox中无法使用(IE中运行很正常),主要是左边的工具栏,因为是用javascript写的,由于存在兼容性的问题导致的,下面就说说一些在自己在解决兼容性问题时遇到的一些问题。

问题一:“addbar is undefined”,出错的代码行:

bar1 = addbar("管理菜单")
//外部引用的Verticalbar.js中addbar方法的定义
function addbar(text, href, target)
{
	return new bar(text, href, target)
}

阅读更多…

分类: Javascript 标签:, ,

延迟加载图片(Lazy load images)

当某个页面非常的长,而且有大量的图片,可以使用延迟加载图片的方法,可以达到不必让页面等所有的图片都加载完,来减少页面链接数,若某访客对整个页面(从头到尾)内容都感兴趣,只是起到了分时加载的效果,但也许有的访客只对页面的第一屏感兴趣,而第一屏以下的大量丰富的图片内容就无需加载出来(而且浪费带宽)。

核心:通过修改浏览器窗口可见区域下面的图片的src属性,这是基于Prototype框架的脚本,本文转载自Lazy Load Images with Prototype,下面就来讲讲怎样将如此好的用户体验快速应用到自己的项目中吧…
阅读更多…

window.close与Firefox

核心:要使window.close在Firefox中有效,必须先设置window.open

对于最常用的关闭窗口链接,都比较熟悉,使用的Javascript函数就是:window.close(),写完后在IE下测试,完全搞定;当你用Mozilla内核的浏览器打开时,点击关闭窗口按钮,你会发现事件并不会像你想象的那么顺利,窗口根本就是无动于衷(真痛恨浏览器的兼容性吧,哈哈,淡定,没有浏览器的兼容性,又怎么会有前端开发这个职业呢),这并不是Mozilla内核浏览器不支持window.close()这个方法(打开W3CSCHOOL,你会发现在Firefox 1.0就已经支持了),那到底是什么原因引起Firefox没有执行这段代码呢(准确地说应该是执行了,但没有产生预期的效果而已,本人一直坚信:就目前这技术,机器是不会骗人的,一切还是人为原因)?
阅读更多…

Javascript渐变动画

核心:Js的定时器,CSS中的透明度属性:opacity、filter

自己一直觉得自己有点浮躁,就像高中化学老师说的那样:眼高手低。今天在做项目时,要做个相册,平时都是直接用JQuery,感觉把很多基本的方法,不过这次突然有点抽筋,想自己写点基础的一些东西,于是决定不用框架。

相册的Js代码属于最基本的东西,首先构思下(可能是因为学过软件测试的原因吧,平时自己做项目时,一直就有个习惯:不急着动手,先构思下大体的框架,怎样才能最合理),然后在编码。大体思路:最先HTML、CSS,然后就是JS的部分,定义最基础的四个方法:previous()、next()、show()、hide(),剩下的就是在这两个方法上扩展,然后加上定时器就OK了,这里最主要谈下,如何通过js改变图片的透明度。
阅读更多…

分类: Javascript 标签:, ,

学到多种去除a标签上获得焦点后的虚线

核心:当链接获得焦点后触发失去焦点即OK.

自己平时做项目时,都使用的直接在A标签上添加onfocus=”blur()”的方法来解决的,后来有人在web标准化联盟里面提到了这个问题,当时有个网友说了个自己没用过的方法(其实自己也根本就不知道):在A标签上添加hidefocus=”hidefocus”、outline: 0;(FF)很感激这些友友们分享自己的经验,让无知的我又学到了,嘻嘻….
阅读更多…

分类: CSS, Htc, Javascript 标签:, , , ,

For循环给每个元素添加事件及闭包的应用

核心:保存循环变量的值

我们在开发过程经常会遇到:通过For循环给对象添加动态事件,代码运行的结果总不是我们想象中的那么美好,这里到底是怎么回事呢?我们就带着问题看看下面的示例吧

之前:

        for(var i=1; i < 4; i++){
                var id = document.getElementById("a" + i);
        /*
        这里生成了一个匿名函数并赋值给对象 id_i;
        */
                id.onclick = function(){
        /*
        这个i来源于局部变量,无法以window.i或者obj.i的形式在后期引用,
        只好以指针或者变量地址方式保存在这个匿名函数中,
        这就是传说的闭包,所以所有这个过程中生成的事件句柄都使用引用
        的方式来持久这个变量,也就是这些匿名函数共用一个变量i;
        */
                          alert(i);
                };
        };

阅读更多…

分类: Javascript 标签:, ,

javascript:URL伪协议

可以使用javascript:URL伪协议来计算Javascript表达式并返回计算的结果;

一个Javascript URL是由javascript:协议说明符加上任意的Javascript代码(语句之间用分号隔开)构成的;

返回URL中的最后一个表达式的值的字符串形式。

分类: Javascript 标签:
加关注

Get every new post delivered to your Inbox.