【发布时间】:2015-11-14 19:09:12
【问题描述】:
我正在尝试在我的 shopify 页面中执行 Jquery。但是 Jquery 没有被执行。当我在 jsfiddle 中使用相同的代码时,代码正在工作(我收到警报消息,但是当我在 shopify 中执行相同的 jquery 时,我没有收到警报消息)。
这里是 jsfiddle 的链接 - https://jsfiddle.net/tusharacc/ck84ad6z/1/
代码与我在 shopify 中使用的代码相同。
HTML 代码包含在 index.liquid 中。 javascript 被上传到 Assets 文件夹中。
Theme.liquid 引用了我的 javascript 文件。此外,主题引用了 lquery.min.js,它包含在我的 javascript 文件之前。
{% include 'oldIE-js' %}
{{ '//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js' | script_tag }}
{{ 'modernizr.min.js' | asset_url | script_tag }}
{{ 'readjson.js' | asset_url | script_tag }}
我已经检查了下面的 shopify 文档,但我不清楚我还需要做什么。 https://docs.shopify.com/api/unlinked/using-javascript-responsibly
任何指针将不胜感激。
已编辑**
根据 shopify 指令,我复制了以下代码来加载执行 jquery。但是,代码仍然无法正常工作,当我调试时,控件一直运行到 loadscript("//ajax...) 之后不知道发生了什么。我尝试 try-catch 显示错误,但我没有得到。
function loadjquery(){
alert("hi");
var loadScript = function(url, callback){
var script = document.createElement("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" ||
script.readyState == "complete"){
script.onreadystatechange = null;
callback();
}
};
} else { //Others
script.onload = function(){
callback();
};
}
};
var myAppJavaScript = function($){
/* Your app's JavaScript here.
$ in this scope references the jQuery object we'll use.
Don't use 'jQuery', or 'jQuery191', here. Use the dollar sign
that was passed as argument.*/
$('body').append('<p>Your app is using jQuery version '+$.fn.jquery+'</p>');
};
if ((typeof jQuery === 'undefined') || (parseFloat(jQuery.fn.jquery) < 1.7)) {
loadScript('//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js', function(){
jQuery191 = jQuery.noConflict(true);
myAppJavaScript(jQuery191);
});
} else {
myAppJavaScript(jQuery);
}
}
【问题讨论】:
-
抱歉,这太离谱了。 jQuery 部分只需要:
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js'></script>您不需要加载器或脚本标签。 -
@bknights,那部分行已经存在,但 Jquery 仍然没有执行。
-
您是否在可公开访问的 Shopify 页面上有此内容?
-
我个人尽量避免在 shopify 脚本标签上使用 JQuery。我发现它有问题。当我花时间用 vanilla JS 编写代码时,它似乎解决了我遇到的所有问题。