Jump to navigation

You are currently browsing all posts tagged with 'js'

把口碑网的评分系统扒下来了，JS部分重写了

  • Posted on June 22, 2010 at 11:27 am

把口碑网的评分系统扒下来了，JS部分重写了。
比较粗糙，凑合着看吧。
star

ie6中png图片透明效果

  • Posted on May 27, 2010 at 1:18 pm

如果你的png图片是透明的，在IE7，FF，chrome下面都不会有什么问题，
但是在IE6里面就郁闷了，图片变得不透明了。

还是直接看代码吧：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
</head>
<body>
	<img src='http://bbs.enjoykorea.net/images/common/medal/xinyushangjia_1-3.png'>
<script>
function m_addLoadEvent(func) {
 
var oldonload = window.onload;
 
if (typeof window.onload != 'function') {
 
window.onload = func;
 
} else {
 
window.onload = function() {
 
oldonload();
 
func();
 
}
 
}
 
}
 
function correctPNG() 
{  
var arVersion = navigator.appVersion.split("MSIE")  
var version = parseFloat(arVersion[1])  
if ((version >= 5.5) && (document.body.filters))  
{  
for(var i=0; i<document.images.length; i++)  
{  
var img = document.images[i]  
//var imgName = img.src.toUpperCase()  
var imgName = img.src;
if (imgName.substring(imgName.length-21, imgName.length) == "xinyushangjia_1-3.png")  
{  
var imgID = (img.id) ? "id='" + img.id + "' " : ""  
var imgClass = (img.className) ? "class='" + img.className + "' " : ""  
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "  
var imgStyle = "display:inline-block;" + img.style.cssText  
if (img.align == "left") imgStyle = "float:left;" + imgStyle  
if (img.align == "right") imgStyle = "float:right;" + imgStyle  
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle  
var strNewHTML = "<span " + imgID + imgClass + imgTitle  
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"  
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"  
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"  
img.outerHTML = strNewHTML  
i = i-1  
}  
}  
}  
} 
 
m_addLoadEvent(correctPNG);
</script>

在utf8页面上添加百度搜索按钮

  • Posted on May 26, 2010 at 9:28 am

遇到一问题，
要在utf8的页面上加入一个按钮，
点击之后进入百度的搜索

代码如下：

<div id="search">
<form name="searchFrm" method="GET" target="_blank">
<input name="keyword" class="keyword" id="keyword" type="text" value="" />
<input type="button" name="baidu_btn" value="百度一下" class="searchBtn" onClick='window.open("http://www.baidu.com/?wd="+encodeURIComponent(this.form.keyword.value),"_blank");return false;' />
        </form>
</div>

么有想到的是，encode之后的字符串竟然是乱码。

想必是因为本页是utf8的，而baidu是gbk的。
于是开始搜索js把utf8转成gbk的函数。
搜到了二个函数，都不能用。要么有js错误，要么转出来的字符串是空的。

后来只好自己做了一个php页面，在里面用iconv做了转化：
代码如下：

<div id="search">
<form name="searchFrm" method="GET" target="_blank">
<input name="keyword" class="keyword" id="keyword" type="text" value="" />
<input type="button" name="baidu_btn" value="百度一下" class="searchBtn" onClick='window.open("baidu.php?wd="+encodeURIComponent(this.form.keyword.value),"_blank");return false;' />
        </form>
</div>

baidu.php代码如下：

<?PHP
$url = "http://www.baidu.com/s?wd=";
$keyword = iconv("UTF-8","GBK", trim($_GET['wd']));
$keyword = urlencode($keyword);
$url .= $keyword;
Header("Location: ". $url);
die();

iframe 跨域自适应高度

  • Posted on May 10, 2010 at 8:58 am

以前写过一篇 <使用js自动调整iframe高度>

http://www.masalife.com/index.php/archives/210

只能用在同域的情况下。（域名相同，端口也要相同）

如果域名不同怎么办？

假如主页面域名是 link.masalife.com
iframe中页面域名是 t.masalife.com
只要在二个页面的

<head></head>

中加入：

<script>
document.domain='masalife.com';
</script>

IE,ff, chrome都有效。

另外：
这二个域名同是masalife.com.的子域名，如果是完全不相关的二个域名，则无效了。

document.getElementsByName在IE中的问题

  • Posted on April 17, 2010 at 10:40 am

今天在前台开发中发现一个费解的问题:
我想使用document.getElementsByName获得页面中一些拥有相同name属性的li标签元素.
该功能代码在FireFox下调试的一切正常,但是转到IE下无论是IE6还是IE7无法正确获得这些元素,调试时发现得到的返回的数组长度为0.既然FF和chrome下正常工作,那么这很明显是一个浏览器兼容问题,查找资料后得到如下结论:

在IE下只有以下标签支持Name属性

A, APPLET, BUTTON, FORM, FRAME, IFRAME, IMG, INPUT, OBJECT, MAP, META, PARAM, TEXTAREA ,SELECT

其他的如DIV,TD,li等标签是无法用getElementsByName方法来获得的.
代码如下：

	function show_children_li(obj)
	{
		var fs = document.getElementsByName('modify');
		for(var i=0; i<fs.length; i++)
		{
				fs[i].style.display = "";
		}
	}

之后决定使用document.getElementsByTagName
代码如下：

	function show_children_li(obj)
	{
		var fs = document.getElementsByTagName('li');
		for(var i=0; i<fs.length; i++)
		{
			if (fs[i].name=='modify')
				fs[i].style.display = "";
		}
	}

给flash加链接

  • Posted on March 25, 2010 at 9:21 pm

<button style=”width:400px;height:400px;background:transparent;

border:0;padding:0;cursor:pointer;” onclick=”window.location.href=’http://masalife.com’”>

然后是flash播放器的代码

然后 </button>

怪不怪。  记得把button的高度和宽度改成和flash相同的。

这种代码是在相同窗口打开的。如果要打开新窗口，就用window.open好了。

缺点： cursor:pointer无效。 鼠标移上去还是普通的指针。

使用js自动调整iframe高度

  • Posted on February 24, 2010 at 9:12 am

百度了一下，发现了最简单的方法：

在被iframe的页面最后，加一行JS：

window.parent.document.getElementById("fang_list_iframe").style.height=document.body.scrollHeight;

经过测试，发现在主页面含有

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

时，IE可以，FF无效。

这个时候人都变得傻X了，竟然想去修改这个DOCTYPE…

虽说把DOCTYPE改成

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

之后，IE和FF都生效了，但是在IE下面，页面布局都变了。。

最后发现，竟然，要这样写才可以：

window.parent.document.getElementById("fang_list_iframe").style.height=document.body.scrollHeight+"px";

看来还是由于自己的JS写得不够规范。。

好了，下面贴出完整代码：

<script>
 window.parent.scrollTo(0,0);
var mainIFrame = window.parent.document.getElementById("fang_list_iframe");
var scrollHeight = parseInt(document.body.scrollHeight);
var offsetHeight = parseInt(document.body.offsetHeight);
var hight;
var isIE = document.all && window.external;
if( isIE )
 hight = scrollHeight;
else
 hight = scrollHeight < offsetHeight?scrollHeight:offsetHeight;


var sUserAgent = navigator.userAgent;


var isChrome = sUserAgent.indexOf("Safari") > -1 ;


if( isChrome)


 hight = hight + 80;


mainIFrame.style.height=hight+"px";


</script>







 











使用JQuery取得html中所有display为none的元素



    

  • Posted on December 28, 2009 at 8:23 pm
    • 

  • 






<html><body><script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js”></script>

<div style=”color:red;display:none”>1</div>

<div style=”color:yellow;display:block”>2</div>

<div style=”color:blue;display:inline”>3</div>

<script type=”text/javascript”>

<!–

$(function()

{

$(“div”).filter(

function()

{

return $(this).css(‘display’)!=’none’;

}

).each(

function()

{

alert($(this).text());

}

);

});

//–>

</script>

</body></html>





 











Jquery 和 JS 配合操作



    

  • Posted on December 28, 2009 at 8:03 pm
    • 

  • 






<div>

<li>

<span>count:</span>

403

</li>

</div>


用js/jq取出403


<script src=./jquery.js></script>

<script type=”text/javascript”>

//jquery本身不支持textNode的选取

$(

function()

{

alert($(“div.extend > li”).get(0).childNodes.item(jQuery.support.boxModel?2:1).nodeValue);

}

);

</script>


或者


alert($($($(“div.extend > li”).attr(‘childNodes’)).get(jQuery.support.boxModel?2:1)).get(0).nodeValue);}





 








    

  • 

  • 




Top