I get this error on this page:
http://pages.purevisionmethod.com/myopia-class-replay/
I try to get this code execute:
<div style="width:1240px;max-width:100%;text-align:center;margin:5rem auto 0 auto;">
<script src="//fast.wistia.com/assets/external/E-v1.js" async></script><div class="wistia_responsive_padding" style="padding:56.25% 0 0 0;position:relative;"><div class="wistia_responsive_wrapper" style="height:100%;left:0;position:absolute;top:0;width:100%;"><div class="wistia_embed wistia_async_4uf1zbu4se videoFoam=true" style="height:100%;width:100%"> </div></div></div></div>
<script>
window._wq = window._wq || [];
wistiaEmbed.bind("secondchange", function (s) {
if(s === 20) {
$('.hiding').fadeIn(500);
}
});
</script>
I get the error: “Uncaught ReferenceError: wistiaEmbed is not defined”
I cannot work out what's going on. The reference should be defined by
<script src="//fast.wistia.com/assets/external/E-v1.js" async></script>
But no matter where I move the file, if in the header, footer, anywhere, I still get the same error.
Can you see why?
Thanks!!
Sorry, I used the wrong type of code to integrate this.
So, for anyone using Wistia who bumps into the same problem:
You need to use the API code to get this to work:
<div class="wistia_responsive_padding" style="padding:56.25% 0 0 0;position:relative;"><div class="wistia_responsive_wrapper" style="height:100%;left:0;position:absolute;top:0;width:100%;">
<div id="wistia_INSERT_YOUR_VIDEO_ID_HERE" class="wistia_embed" style="height:100%;width:100%"> </div></div></div>
<script src="//fast.wistia.com/assets/external/E-v1.js" charset="ISO-8859-1"></script>
<script>
wistiaEmbed = Wistia.embed("INSERT_YOUR_VIDEO_ID_HERE");
</script>
<script>
(function($){
wistiaEmbed.bind("secondchange", function (s) {
if(s === 20) {
$('.hiding').show();
}
});
})(jQuery);
</script>
So, you have to paste in you video ID where I placed: INSERT_YOUR_VIDEO_ID_HERE.
You can find that in the normal Wistia javascript embed code. It's the only weird number code in it.
For <div id="wistia_INSERT_YOUR_VIDEO_ID_HERE" you must have the wistia_ in front of the video ID, so it works.
Hope that helps anyone!
Related
I am having issues trying to run an API using Geocodio. This is set up through WordPress and I would really appreciate any help I can get!
Everything works up until the actual API itself has to run. The Geocodio documentation states that it runs "using a jQuery AJAX call". I have tried multiple script sources that claim to fix the problem, but I get the error that "superfish() is not a function" or that "Cannot read properties of undefined (reading 'get')".
<head>
<script src="jQuery.js"></script>
<script src="superfish.js"></script>
<script>
jQuery(document).ready(function() {
jQuery('ul.sf-menu').superfish();
});
</script>
</head>
<body>
<input type="text" id="myTxt" style="width: 400px;" placeholder="Type Your Address Here!"></input>
<input type="submit" id="myBtn" value="Search Now!"></input>
<script>
var submit = document.getElementById("myBtn")
var myInput = document.getElementById("myTxt")
submit.addEventListener("click", geocodio)
function geocodio() {
if(myInput.value.length == 0) {
alert("Please input a valid address")
}
else {
$.get('https://api.geocod.io/v1.7/geocode?q='+ encodeURIComponent(myInput)
+'&api_key=' + encodeURIComponent('YOUR_API_KEY'), function (response) {
console.log(response.results)});
}
};
</script>
</body>
You must be using some strange version of jQuery that forces you to refer to it as jQuery and not $. Odd, I thought all versions of jQuery also set up the $ global.
Try replacing $ with jQuery inside geocodio():
function geocodio() {
if (myInput.value.length == 0) {
alert("Please input a valid address")
}
else {
jQuery.get('https://api.geocod.io/v1.7/geocode?q=' + encodeURIComponent(myInput.value)
+ '&api_key=' + encodeURIComponent('YOUR_API_KEY'), function (response) {
console.log(response.results);
});
}
}
(also fixed: encode myInput.value instead of encoding whole input)
If that doesn't work, perhaps jQuery.js failed to load. Check the console messages and/or network trace tab in the developer tools.
If that doesn't work, try stepping thru the code using the JavaScript debugger built in to your browser (short tutorial video).
I have a script in the footer of a site. I want the widget to be shown if url contains 'mystring', and if not, then not to be shown
<script>
if (window.location.href.indexOf("mystring") > -1) {
<script type="text/javascript" src="https://vk.com/js/api/openapi.js?169"></script>
<!-- VK Widget -->
<div id="vk_community_messages"></div>
<script type="text/javascript">
if($(window).width()>800) {
VK.Widgets.CommunityMessages("vk_community_messages", 203651941, {expandTimeout: "20000",tooltipButtonText: "Any Question?"});
}
if($(window).width()<=800) {
VK.Widgets.CommunityMessages("vk_community_messages", 203651941, {tooltipButtonText: "Any Question?"});
}}
</script>
This code produces the following errors:
Uncaught SyntaxError: Unexpected identifier (string 3)
Uncaught SyntaxError: Unexpected token '}' (string 12)
You've got <script> tags and other HTML inside the outer <script> tags, that simply isn't allowed and isn't ever going to work. This is a fairly basic thing you should have learned when first learning about HTML and JavaScript.
This will make more sense (I can't test it easily so no guarantees it will work exactly, but it certainly won't have any fundamental design flaws or syntax errors, so it should point you down the right road):
<div id="vk_community_messages"></div>
<script type="text/javascript" src="https://vk.com/js/api/openapi.js?169"></script>
<script>
if (window.location.href.indexOf("mystring") > -1) {
if($(window).width()>800) {
VK.Widgets.CommunityMessages("vk_community_messages", 203651941, {expandTimeout: "20000",tooltipButtonText: "Any Question?"});
}
if($(window).width()<=800) {
VK.Widgets.CommunityMessages("vk_community_messages", 203651941, {tooltipButtonText: "Any Question?"});
}
}
</script>
I am running into a javascript issue where it's getting a "Uncaught ReferenceError: $ is not defined". With my reading I think it's the order of when I am trying to do $(document).ready before the javascript is loaded up but I am not sure what to do about it. I have tried moving the jquery and the fileuploadmulti above the script but then I get "Uncaught TypeError: $(...).uploadFile is not a function" and then I go down the road of chicken and egg and don't know what is correct. Any help or point in the right direction would be helpful. Thank you.
<script>
//This is where my error shows up
$(document).ready(function(){
var settings = {
url: "/index.php/upload",
method: "POST",
allowedTypes:"jpg,png,gif,doc,pdf,zip",
fileName: "myfile",
multiple: true,
onSuccess:function(files,data,xhr)
{
$("#status").html("<font color='green'>Upload is success</font>");
},
afterUploadAll:function()
{
alert('All Files uploaded');
},
onError: function(files,status,errMsg)
{
$("#status").html("<font color='red'>Upload is Failed</font>");
}
};
$("#mulitplefileuploader").uploadFile(settings);
});
</script>
<script src="/js/jquery.js"></script>
<script src="/js/fileuploadmulti.min.js"></script>
<div class="boxed link">
<div id="mulitplefileuploader">Upload</div>
<div id="status"></div>
</div>
<div class="col-lg-12">
<h1>Adding pages to <?php echo $model->name; ?></h1>
</div>
First check whether JQuery is loaded or not.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
And wrap the all JQuery code inside $(document).ready(function(){ \\code here }); function.
$(...).uploadFile is not a function error because you are not loading the fileupload plugin properly.
Check all script tag URL'S are right or not.
You are using the $ before including jQuery. Try to include it before.
Try to include
<script src="/js/jquery.js"></script>
<script src="/js/fileuploadmulti.min.js"></script>
before $(document).ready(function(){ });
Good evening!
I had a working functionality on a sharepoint document library. It's purpose was to copy the name of a file to the title column.
It was working for a long time but after an update to the sharepoint platform it stopped working and i can't figure out why.
The code:
<input type="button" onclick="updateTitleFromName()" value="Update Title from Name" />
<script type="text/javascript" src="/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="/Scripts/spjs-utility/spjs-utility.js"></script>
<script type="text/javascript">
function updateTitleFromName(){
var q, res, uRes, count;
count = 0;
q = "<Where><IsNull><FieldRef Name='Title' /></IsNull></Where>";
res = spjs_QueryItems({"listName":_spPageContextInfo.pageListId,"query":q,"viewFields":["ID","FileLeafRef"]});
if(res.count === 0){
alert("No files without title found.");
return;
}
if(!confirm("There are "+res.count+" files to update. The page will appear as frozen while the script is working.\n\nContinue?")){
return;
}
$.each(res.items,function(i,item){
uRes = spjs_updateItem({"listName":_spPageContextInfo.pageListId,"id":item.ID,"data":{"Title":item.FileLeafRef.split(";#")[1]}});
if(!uRes.success){
alert("Could not update the file: "+item.FileLeafRef+" due to the follwing error:\n\n"+uRes.errorText);
}else{
count += 1;
}
});
alert("Updated "+count+" files.");
location.href = location.href;
}
</script>
The error is: TypeError: $spjs is null. And it occurs inside the library spjs-utility library on the spjs_QueryItems call.
Maybe this could be due to a conflictuous library that as added during the updated, but how can i debug this?
Also, if this doesn't work, wouldn't it be simpler to do the same with jQuery? Thats what i'm trying right now, but i'm a beginner as you must have perceived.
Thanks in advance.
Best
I would test if JQuery is loaded or not in your updateTitleFromName function:
if (window.jQuery) {
alert('loaded');
} else {
alert('not loaded');
}
if it is not loaded, try to reference your scripts with absolute urls to see if you can load them:
<script type="text/javascript" src="http://myportal/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="http://myportal/Scripts/spjs-utility/spjs-utility.js"></script>
I keep getting Uncaught ReferenceError: $ is not defined error.
I assume everything is ok and working. My JQuery code is inside my Javascript file. I assume that isn't how it works? Should I have a JQuery file?
I have this inside the head of my HTML
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
This is my Javascript file:
function typing(id, sentence){
var result = $.Deferred();
var index=0;
var intObject= setInterval(function() {
document.getElementById(id).innerHTML+=sentence[index];
index++;
if(index==sentence.length){
clearInterval(intObject);
}
}, 100);
return result.promise();
}
var sleep = function(ms) {
var result = $.Deferred();
setTimeout(result.resolve, ms);
return result.promise();
};
typing('container','Subject Name:').then(function() {
return sleep(500);
}).then(function() {
return typing('container',' Carlos Miguel Fernando')
});
Where did I go wrong?
Your question is fairly unclear, but essentially, you just have to make sure jQuery is loaded before your code. So for instance:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="your-code.js"></script>
or
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script>
// Your code
</script>
But not
<!-- Not like this -->
<script src="your-code.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
Note the order of tags.
These tags do not need to be in the head, and in fact, putting them there is not best practice. They must be in head or body. Best practice barring a specific reason to do something else is to put them at the very end of body, e.g.:
<!-- site content here -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="your-code.js"></script>
</body>
</html>