Hey guys I'm getting a syntax error on my var url line but I can't seem to figure out
what or why it is, help appreciated
SW.wmode = {
init: function() {
$('iframe').each(function()
var url = $(this).attr("src")
$(this).attr("src",url+"?wmode=transparent")
);
}
}
You're missing semicolons after each line's expression, and some braces.
SW.wmode = {
init: function() {
$('iframe').each(function() {
var url = $(this).attr("src");
$(this).attr("src",url+"?wmode=transparent");
});
}
};
You are missing the opening and closing braces of the function argument to each. Your code should be:
SW.wmode = {
init: function() {
$('iframe').each(function(){
var url = $(this).attr("src")
$(this).attr("src",url+"?wmode=transparent")
});
}
}
try this:
SW.wmode = {
init: function() {
$('iframe').each(function() { //you were missing the brackets
var url = $(this).attr("src")
$(this).attr("src",url+"?wmode=transparent")
});
}
}
Well, you're missing some curly braces... Try running your code through a javascript validator like jshint or jslint to help you catch these things.
Most reasonable text editors will have a plugin that can point out any validation errors on save, so that you don't have to do weird troubleshooting in the browser.. or here! ;)
Here's the valid code:
SW.wmode = {
init: function () {
$('iframe').each( function() {
var url = $(this).attr('src');
$(this).attr('src', url+"?wmode=transparent");
});
}
}
I refactored your code a bit:
SW.wmode = {
init: function () {
$( 'iframe' ).attr( 'src', function ( i, url ) {
return url + '?wmode=transparent';
});
}
};
Related
I have set up a simple AJAX page loading script on my site and so far everything is working except for the Unicode Characters in the <title> get screwed up when loading the new content.
My jQuery setup looks like so:
jQuery(document).ready(function ($) {
"use strict";
var main = $("main");
menuLinks.click(function () {
var href = $(this).attr("href"),
ajaxLoad = function (html) {
document.title = html.match(/<title>(.*?)<\/title>/)[1].trim();
main.fadeIn('slow');
};
history.pushState(null, null, href);
main.fadeOut('slow', function () {
main.load(href + ' main>*', ajaxLoad);
});
return false;
});
});
My <title> have dashes in them and they end up as – when the page titles are loaded. I'm under the impression that this has to do something with jQuery and HTML using different encoding but am not sure how to solve the problem.
jQuery(document).ready(function ($) {
"use strict";
var main = $("main");
menuLinks.click(function () {
var href = $(this).attr("href"),
ajaxLoad = function (html) {
document.title = html.match(/<title>(.*?)<\/title>/)[1].text().trim();
main.fadeIn('slow');
};
history.pushState(null, null, href);
main.fadeOut('slow', function () {
main.load(href + ' main>*', ajaxLoad);
});
return false;
});
});
I ended up using document.title = $(html).filter('title').text(); instead of document.title = html.match(/<title>(.*?)<\/title>/)[1].trim(); and it seemed to do the trick in solving the unicode character issue.
Im trying to make my first jquery plugin.. but actually i dont know what im doing wrong here.
$(document.ready(function()
{
var plugin = (function()
{
//this function is not accessible from the outside
function privateFunction()
{
}
//these functions are
return
{
alert1: function()
{
alert('Hallo');
},
alert2: function()
{
alert("hi");
}
}
})()
//but it is not working :/
plugin.alert1();
});
it is not executing one of the alerts. Am i putting some semicolons wrong?
i checked if all were closed
Javascript's automatic semicolon insertion will add a semicolon after return and undefined is returned.
Your code will look like
return;
{...
Replace
return
{
Should be
return {
You're also missing the ) after document in the first line of code.
Demo
$(document).ready(function() {
var plugin = (function() {
//this function is not accessible from the outside
function privateFunction() {
// Code Here
}
//these functions are
return {
alert1: function() {
alert('Hallo');
},
alert2: function() {
alert("hi");
}
};
}());
//but it is not working :/
plugin.alert1();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
I have been programming a website recently. However, when I add this function:
var getInput = function() {
$('#inputSubmit').click(function() {
return $('input[name=input1]').val();
)};
};
My text code breaks. Does anyone know what is wrong?
try this:
var getInput = function() {
$('#inputSubmit').click(function() {
return $('input[name="input1"]').val(); // added " "
}); // )} --> })
};
I am trying to use the hover function which is pretty rudimentary, but I can't seem to get the mouseout/mouseleave to function properly.
Code:
$(document).ready(function(){
$('.SList').css('display','none');
$(".MList a").on('mouseenter',
function(){
var HTMLArr = $(this).children().html().split(':');
$(this).children('p').replaceWith('<p>'+HTMLArr[0]+': ◤</p>');
$(this).siblings('.SList').slideDown('slow');
})
.on('mouseleave',function(){
var HTMLArr = $(this).children().html().split(':');
$(this).children('p').replaceWith('<p>'+HTMLArr[0]+': ◢</p>');
$(this).siblings('.SList').slideUp('slow');
});
});
The mouseenter works properly, but it is not even entering the code for the mouseleave. Any ideas would be greatly appreciated.
Fiddle
See this: DEMO
$(".MList a").on('mouseenter',
function(){
var HTML = $(this).children('p').html();
$(this).children('p').html(HTML.replace('◢','◤'));
$(this).siblings('.SList').slideDown('slow');
})
.on('mouseleave',function(){
var HTML = $(this).children('p').html();
$(this).children('p').html(HTML.replace('◤','◢'));
$(this).siblings('.SList').slideUp('slow');
});
You have an issue with the anchor of the event.
Change to use this:
$(".MList a").on('mouseenter', function () {
var myP = $(this).children('p');
var HTMLArr = myP.text().split(':');
myP.html( HTMLArr[0] + ': ◤');
$(this).next('.SList').slideDown('slow');
}).on('mouseleave', function () {
var myP = $(this).children('p');
var HTMLArr = myP.text().split(':');
myP.html( HTMLArr[0] + ': ◢');
$(this).next('.SList').slideUp('slow');
});
You have the same issue with click, and redo same thing. SO, rework and reuse: (you could even make it better but this shows the start of that)
$(".MList a").on('mouseenter', function () {
down($(this).find('p').eq(0));
}).on('mouseleave', function () {
up($(this).find('p').eq(0));
});
$(".MList a").click(function () {
if ($(this).siblings('.SList').is(':visible')) {
up($(this).find('p').eq(0));
} else {
down($(this).find('p').eq(0));
}
});
function up(me) {
var HTMLArr = me.text().split(':');
me.html(HTMLArr[0] + ': ◢');
me.parent().next('.SList').slideUp('slow');
}
function down(me) {
var HTMLArr = me.text().split(':');
me.html(HTMLArr[0] + ': ◤');
me.parent().next('.SList').slideDown('slow');
}
Recently, I'm coding javascript with little knowledge of it.
And here's my first javascript code which written this morning.
$(window).load(function(){
SubMenuHandler.init();
});
var SubMenuHandler = {
init : function() {
$("#statisticManager, #deviceManager, #policyManager").click(
function(event) {
var url = SubMenuHandler.getUrlFromEvent(event); // <-- These two
SubMenuHandler.redirectPage(url); // <-- lines
}
);
},
redirectPage : function(url) {
$(location).attr("href", url);
},
getUrlFromEvent : function(event) {
var target = event.target;
var url = $(target).data("url");
return url;
}
}
As you can see, SubMenuHandler is called recursively in the class.
But, I don't see how this is done as good. From my experiences with other languages, they usually use the this keyword instead of using the full name of class, except when accessing static variables.
Is there similar or better way to do this job?
init : function() {
var me = this; // <----- this is the magic
$("#statisticManager, #deviceManager, #policyManager").click(
function(event) {
var url = me.getUrlFromEvent(event);
me.redirectPage(url);
}
);
},
It is called "closures"
The random link from google: http://www.javascriptkit.com/javatutors/closures.shtml
And perfect answer here on SO: https://stackoverflow.com/a/111200/251311