Javascript jQuery插件在我的场景中没有动态加载
我正在使用CloudZoom jQuery插件应用图像缩放效果。基本要求是在其周围有一个名为cloud zoom的标记。但我只是用源代码和cloudzoom类动态包装。然后我尝试加载CloudZoom的JS和CSS文件。但我无法做到这一点。。 我的代码如下Javascript jQuery插件在我的场景中没有动态加载,javascript,jquery,Javascript,Jquery,我正在使用CloudZoom jQuery插件应用图像缩放效果。基本要求是在其周围有一个名为cloud zoom的标记。但我只是用源代码和cloudzoom类动态包装。然后我尝试加载CloudZoom的JS和CSS文件。但我无法做到这一点。。 我的代码如下 function zoomer(type,size) { var str=""; str+= '<script type="text/javascript" src="/jQueryLatest/jquery-1.6.4.min.js"
function zoomer(type,size)
{
var str="";
str+= '<script type="text/javascript" src="/jQueryLatest/jquery-1.6.4.min.js"></script>'
str+= '<script type="text/javascript" src="/5.js"></script>'
str+= '<script type="text/javascript">'
str+= "$(document).ready(function()"
str+= "{"
str+= "$('img.make').each(function()"
str+= "{"
str+= "var $this=$(this);"
str+= "$this.resize("+size+");"
str+= "var zoomStr=zoomString($this,"+type+");"
str+= "$this.wrap(''+zoomStr+'');"
str+= "disableRightClick();"
str+= "});"
str+= "loadPlugin(";
str+= type;
str+= ");"
str+= "});"
str+= "</script>"
return str;
}
函数缩放器(类型、大小)
{
var str=“”;
str+=''
str+=''
str+=''
str+=“$(文档).ready(函数()”
str+=“{”
str+=“$('img.make')。每个(函数()
str+=“{”
str+=“var$this=$(this);”
str+=“$this.resize(“+size+”)
str+=“var zoomStr=zoomString($this,“+type+”)
str+=“$this.wrap(“”+zoomStr+“”);”
str+=“禁用右键单击();”
str+=“}”)
str+=“loadPlugin(”;
str+=type;
str+=”
str+=“}”)
str+=“”
返回str;
}
loadPlugin函数是
function loadPlugin(choic)
{
var plug=choic;
if(plug >= 1 && plug <= 4)
{
var Code='<link href="http://www.professorcloud.com/styles/cloud-zoom.css" rel="stylesheet" type="text/css" />'
Code+= '<script type="text/javascript" src="http://www.professorcloud.com/js/cloud-zoom.1.0.2.js"></script>'
$('a.cloud-zoom').live('click',function(e)
{
e.preventDefault();
});
return Code;
}
}
函数加载插件(choic)
{
var plug=choic;
如果(plug>=1&&plug您正在动态加载脚本,但它的代码被包装在document.ready
中,这是一个仅在页面(大部分)完成加载时才会触发的事件。加载脚本时它已经来了又走了,因此它永远不会运行
只要去掉这个包装
str+=“$(文档).ready(函数()”
…为什么不直接使用$.getScript呢?将javascript作为字符串文本嵌入既繁琐又容易出错。您正在动态加载脚本,但它的代码被包装在文档中。ready
这是一个仅在页面(大部分)打开时才会触发的事件加载完毕。加载脚本时,脚本已经出现并消失,因此它将永远不会运行
只要去掉这个包装
str+=“$(文档).ready(函数()”
…为什么不直接使用$.getScript呢?将javascript作为字符串文字嵌入是一件乏味且容易出错的事情。“加载脚本时它已经来了又走,所以它永远不会运行”我喜欢这句话…-)“加载脚本时它已经来了又走,所以它永远不会运行”我喜欢这句话…-)
function zoomString(ele,choice)
{
var str="";
if(choice == null) choice = 1;
var src = ele.attr('src');
switch(choice)
{
case 1:
str = '<a href="' + src + '" class="cloud-zoom" rel="adjustX: 10, adjustY:-4" target="_blank"/>';
break;
case 2:
str = '<a href="' + src + '" class="cloud-zoom"';
str+= 'rel="'+"position:'inside', showTitle: false, adjustX:-4, adjustY:-4"+'" target="_blank"/>';
break;
case 3:
str = '<a href="' + src + '" class="cloud-zoom"';
str+= 'rel="'+"tint: '#E8E8E8',tintOpacity:0.5 ,smoothMove:5,zoomWidth:480, adjustY:-4, adjustX:10"+'" target="_blank"/>';
break;
case 4:
str = '<a href="' + src + '" class="cloud-zoom"';
str+= 'rel="'+"softFocus: true, position:'anypos', smoothMove:2"+'" target="_blank"/>';
break;
}
return str;
}