三种方法动态加载Js文件

碰到需要加载多个Js文件的情况,使用选择性的动态加载Js
,可以提高页面显示的速度和效率。

下面介绍三种异步执行加载Js
脚本的方法。

1、直接document.write

<script language="javascript">

    document.write("<script src='test.js'><\/script>");

</script>

2、动态改变已有script的src 属性

<script src='' id="s1"></script>

<script language="javascript">

    s1.src="test.js"

</script>

3、动态创建 script元素

<script>

    var oHead = document.getElementsByTagName('HEAD').item(0);

    var oScript= document.createElement("script");

    oScript.type = "text/javascript";

    oScript.src="test.js";

    oHead.appendChild( oScript);

</script>


这三种方法都是异步的,所以在采用这类方法动态加载Js
的同时,主界面的Js脚本是继续执行的,所以可能出现通过异步加载的Js代码得不到预期的效果的情况。这时候可以考虑采用Ajax加载Js的方法。

大概原理
:用XMLHTTP取得要脚本的内容,再创建 Script 对象。另外注意编码的保持一致。因为服务器与XML使用UTF8编码传送数据。

magento促销方案之 - 购物车内点击赠送礼品

 

今天做了关于magento的另外一种促销方案
:在购物车根据客户购买商品数量赠送等数价格为0的小礼品。

希望目标
:在购物车页面左下角块中显示后台设置的赠品专区里的设定数量的商品,当用户点击某款赠品时,即添加到购物车。(根据用户购买商品数可选等量的赠品)

实现

1,在后台建立一个专门存放价格为0的赠品的目录A。另外,将目录的General Information的Is Active属性设为NO,这样在前台商品目录就不会显示这个赠品目录,但在购物车那边客户读取这个目录的产品。

2,然后向目录A添加几个测试商品a1,a2,a3...,注意在Product Information
把Inventory里的Qty设为大于0、价格设为0、
Stock Availability选项选为In Stock、Websites里的站也要勾上,这样赠品添加完毕。

3,代码修改

a文件: /app/design/frontend/default/beautyard/template/checkout/cart.phtml

头部加上:<script>var x = 0,y=0;</script>

b文件: /app/design/frontend/default/beautyard/template/checkout/cart/crosssell.phtml

也是在头部加上():
<?php
$cartNumbers    = Mage::helper('checkout/cart')->getCart()->getSummaryQty();
$maxGift    = 3;    //控制要显示的赠品数
$categoryIds    = 726;    //网站赠品目录的id
$_productCollection = Mage::getResourceModel('reports/product_collection')
        ->addAttributeToSelect('*')    ->addAttributeToFilter('category_ids',array('finset'=>$categoryIds));
$category     = Mage::getModel('catalog/category');
$category->load($categoryIds);
$collection     = $category->getProductCollection();
foreach ($collection as $product) {
    $result[]     = $product->getId();
}
?>
<div id="cartGift" name="cartGift" class="box-others-also-like">
<ul>
<?php
if(count($result)>$maxGift){
    $ourneed = array_rand($result,$maxGift);
    foreach($ourneed as $cc){
    $thisproduct= Mage::getModel('catalog/product')->load($result[$cc]);
?>
    <li>
    <a href="/checkout/cart/add?product=<?php echo $result[$cc]; ?>&qty=1" title="<?php echo $thisproduct->getName(); ?>" ><?php echo $thisproduct->getName(); ?></a>
    </li>
<?php
    }
} ?>
</ul>
</div>
<div id="cartGiftTips" name="cartGiftTips">choose over</div>
<script>(x<=y)?($('cartGift').hide()&&$('cartGiftTips').show()):($('cartGift').show()&&$('cartGiftTips').hide())</script>

c文件:/app/design/frontend/default/beautyard/template/checkout/cart/item/default.phtml

160行左右加上:
<?php if($_item->getCalculationPrice()>0):?>
    <script>x+=<?php echo $this->getQty();?>;</script>
<?php else: ?>
    <script>y+=<?php echo $this->getQty();?>;</script>
<?php endif; ?>
接着更改之后的td:
    <td class="a-center">
        <input name="cart[<?php echo $_item->getId() ?>][qty]" value="<?php echo $this->getQty() ?>" size="4" title="<?php echo $this->__('Qty') ?>" class="input-text qty" maxlength="12"<?php if($_item->getCalculationPrice()==0):?>readonly<?php endif; ?>
/>
    </td>

OK!到此关于magento购物车赠品促功能完毕!

jquery url检测遇到的jquery跨域问题及JSONP的使用

jsonp的ibm上的资料:

使用 JSONP 实现跨域通信,第 1 部分: 结 合 JSONP 和 jQuery 快速构建强大的

 

跨域限制的原因

 跨域问题存在实际上源于浏览器的同源策略(same origin policy),简单讲,同源就是要求域名,协议,端口三者都一致;而同源策略就是指页面上的脚本不能访问非同源的资源(包括HTTP响应和Cookie);

    很多人会想到一个很熟悉的东西:document.domain

    同 源策略有点放松的就是:b.a.com上的页面无法通过a.com的同源验证,但是设置b.a.com页面的document.domain 属性为a.com,就可以通过浏览器对a.com的同源检测;但是,document.domain只允许设置成更上级的域名,而不是 其它域名,例如c.com就不行; 提到这里很多人都会想到多级域 名下共享Cookie的路子就是把Cooki设置成上级域名;在Web2.0的时代,这种本质上同域跨级解决方案远远不能满足我们跨域的需求;

 

JQUERY的解决办法

浏览器会进行同源检查,这导致了跨域 问题,然而这个跨域检查还有一个例外那就是HTML的<Script>标记;我们经常使用<Script>的src属性,脚本静 态资源放在独立域名下或者来自其它站点的时候这里是一个url;这个url响应的结果可以有很多种,比 如JSON,返回的Json值成为<Script>标签的src属性值.这种属性值变化并不会引起页面的影响.按照惯例,浏览器在URL的查询字符串中提 供一个参数,这个参数将作为结果的前缀一起返回到浏览器;

 

<script type="text/javascript" src="http://domain2.com/getjson?jsonp=parseResponse"> </script> 响应值:parseResponse({"Name": "Cheeso", "Rank": 7}) 注意这里的响应值parseResponse({"Name": "Cheeso", "Rank": 7}),JSONP中URL传入的参数实际上是个回调函数,网站返回的也不是纯JSON数据,如果只有数据,返回后浏览器不会有任何动作。

撇开JQuery,如果自己写JSONP调用,<script src="http://domain2.com/getjson?callback=load"></script>,这时候服返回的数据是类似 load({jsonp数据});(也就是说返回的那个调用函数随着你传入的 callback 而改变。) 这样的javascript代码,调用页面上的load函数,同时把数据传进去。

11款实用的一句话网站设计代码

 

整理了一些比较实用的网站设计时常用的代码代码很简单,只有一行,不需要理解高深的JS或者HTML知识,按照提示把相应的代码加入到网页模板中即可得到你想要的效果。

1:进入网页淡入淡出的效果。

<meta http-equiv="Page-Exit"; content="blendTrans(Duration=1.0)">

在头部head之间加入此代码,你会发现点击链接的时候,网页现实的是淡入淡出的效果。此代码含义如下:Page-Exit”(离开网页)、”Site-Enter”(进入站点)、”Site-Exit”(离开站点)其中”Duration=1.0″可以设定每个周期时间久,单位是秒(现在设置的是每周期1秒)。 

2:把滔滔(微博客)完美放到你的博客中。试用于各种程序言。演示见本站公告.红色部分注意事项:改成你的QQ号。 1就是只显示一条信息。这是JS文件路径下载地址://sjolzy.cn/content/uploadfile/dkapi.js

<script type="text/javascript">var taotao_qq=409124564; var taotao_num=1;var taotao_type=0;</script><script type="text/javascript" charset="utf-8" src="reed/dkapi.js"></script>


3:彻底屏蔽鼠标右键。此段代码加入<body>区域

<body   oncontextmenu="window.event.returnValue=false">  

4: 此段代码加入<body>区域将取消选取、防止复制。

<body   onselectstart="return   false">

5:不准粘贴。 此段代码加入<body>区域

<body   onpaste="return   false"> 

6:防止网站被扒皮。如何防止网站被扒皮呢?加入以下代码就可以了,网页将不能被另存为 

<noscript><iframe   src="/blog/*.html>";</iframe></noscript>

7:脚本永不出错,如果您的浏览器提示您的网址JS脚本出错,但检测了一遍没发现错误,就可以使用一下代码:  


  <SCRIPT   LANGUAGE="JavaScript"><!--   Hide nction" title="function">function   killErrors()   {return   true;} window.onerror   =   killErrors; //   --> </SCRIPT>

8:在规定时间内跳转,意思就是5秒后自动跳转到该页面下,适合做404网页。  

<META  http-equiv=V="REFRESH"  content="5;URL=//sjolzy.cn">

9:可防止复制,此段代码加入<body>区域

<body oncopy="return   false;"   oncut="return   false;" > 

10. 防止被人frame。例:有些网址导航站收录您的网址之后,不会直接跳转到你的网站,而是加载到他的网页中,这样不会给你的网站产生任何IP和PV。如果您不希望这样,那么请加入此段代码

<SCRIPT  LANGUAGE=JAVASCRIPT><!-- if (top.location != self.location)top.location=self.location;// --></SCRIPT>

11:页面自动刷新,把如下代码加入 <head> 区域中 其中20指每隔20秒刷新一次页面. 可用户增加文章点击率,这是作弊行为。

<meta http-equiv= "refresh " content= "20 "> ,

使用jquery过滤上传文件的类型和限制文件的大小

 

<script type="text/javascript"> 

$(document).ready(function(){ 

$("#form0").submit(function() {

var filepath=$("input[name='myFile']").val(); 

        var extStart=filepath.lastIndexOf("."); 

        var ext=filepath.substring(extStart,filepath.length).toUpperCase(); 

        if(ext!=".BMP"&&ext!=".PNG"&&ext!=".GIF"&&ext!=".JPG"&&ext!=".JPEG"){ 

        alert("图片限于bmp,png,gif,jpeg,jpg格式"); 

        return false; 

        } 

        

   var img=new Image(); 

   img.src=filepath;   

while(true){ 

   if(img.fileSize>0){ 

   if(img.fileSize>3*1024){       

alert("图片不大于300KB。"); 

return false; 

   } 

       break; 

   } 

   return true;      

}); 

}); 

</script>

标签: script, var, return, 图片, ext