JQuery selector works perfect, except with Safari - javascript

I want to fetch an URL-Attribute from a div and my code works perfectly find, except on Safari, where this line:
var url = $('.image').css('background-image').split('url("')[1].split('")')[0];
throws an Error, because the .split-function cannot be executed on an undefined object. Can somebody explain me why Safari does not like this code?

So, I figured it out. When you call $('.image').css('background-color') on a browser that is not Safari, you get the following string:
url("http://www.image.com/image1.jpg")
When you call $('.image').css('background-color') using Safari, the following string is returned:
url(http://www.image.com/image1.jpg)

Related

ActiveXObject Support in jQuery? How is it Possible

This is for Non-IE browsers-
I was working on a requirement which needed a XML file to be parsed. After looking at some options, i ended up finding $.parseXML in jQuery.
It worked fine and i can now read the content of the XML from there. But what surprised me was this-
Definition of $.parseXML is-
$.parseXML = function (n){
var r,i;if(!n||"string"!=typeof n)return null;
try{
e.DOMParser
? (i=new DOMParser,r=i.parseFromString(n,"text/xml"))
: (r=new ActiveXObject("Microsoft.XMLDOM"),r.async="false",r.loadXML(n))
}catch(o){
r=t
}
return r&&r.documentElement&&!r.getElementsByTagName("parsererror").length||b.error("Invalid XML: "+n),r}
Now, if you look at the code, the part 'r=new ActiveXObject("Microsoft.XMLDOM")' is what confuses me the most.
Normally, if we try the same thing independently, then the following error is thrown-
ReferenceError: ActiveXObject is not defined
Can someone explain me how is this made possible in jQuery?
The code inside the function definition is meant for IE only.
The ActiveX code is present as a fallback mechanism in case the browser is IE and doesn't support DOMParser(IE9 Supports DOMParser). My guess it that it's still there in case of executing the jquery code in IE8 and below.

Javascript error only in IE8

I get this javascript error in IE 8
SCRIPT5007: Object expected
The error point to this line
/*#cc_on(function(a,b){function r(a){var b=-1;while(++b<f)a.createElement(e[b])}if(!window.attachEvent||!b.createStyleSheet||!function(){var a=document.createElement("div");return a.innerHTML="<elem></elem>",a.childNodes.length!==1}())return;a.iepp=a.iepp||{};var c=a.iepp,d=c.html5elements||"abbr|article|aside|audio|canvas|datalist|details|figcaption|figure|footer|header|hgroup|mark|meter|nav|output|progress|section|subline|summary|time|video",e=d.split("|"),f=e.length,g=new RegExp("(^|\\s)("+d+")","gi"),h=new RegExp("<(/*)("+d+")","gi"),i=/^\s*[\{\}]\s*$/,j=new RegExp("(^|[^\\n]*?\\s)("+d+")([^\\n]*)({[\\n\\w\\W]*?})","gi"),k=b.createDocumentFragment(),l=b.documentElement,m=b.getElementsByTagName("script")[0].parentNode,n=b.createElement("body"),o=b.createElement("style"),p=/print|all/,q;c.getCSS=function(a,b){try{if(a+""===undefined)return""}catch(d){return""}var e=-1,f=a.length,g,h=[];while(++e<f){g=a[e];if(g.disabled)continue;b=g.media||b,p.test(b)&&h.push(c.getCSS(g.imports,b),g.cssText),b="all"}return h.join("")},c.parseCSS=function(a){var b=[],c;while((c=j.exec(a))!=null)b.push(((i.exec(c[1])?"\n":c[1])+c[2]+c[3]).replace(g,"$1.iepp-$2")+c[4]);return b.join("\n")},c.writeHTML=function(){var a=-1;q=q||b.body;while(++a<f){var c=b.getElementsByTagName(e[a]),d=c.length,g=-1;while(++g<d)c[g].className.indexOf("iepp-")<0&&(c[g].className+=" iepp-"+e[a])}k.appendChild(q),l.appendChild(n),n.className=q.className,n.id=q.id,n.innerHTML=q.innerHTML.replace(h,"<$1font")},c._beforePrint=function(){if(c.disablePP)return;o.styleSheet.cssText=c.parseCSS(c.getCSS(b.styleSheets,"all")),c.writeHTML()},c.restoreHTML=function(){if(c.disablePP)return;n.swapNode(q)},c._afterPrint=function(){c.restoreHTML(),o.styleSheet.cssText=""},r(b),r(k);if(c.disablePP)return;m.insertBefore(o,m.firstChild),o.media="print",o.className="iepp-printshim",a.attachEvent("onbeforeprint",c._beforePrint),a.attachEvent("onafterprint",c._afterPrint)})(this,document)#*/
However all that had been commented. Some ajax calls aren't being executed(again only in ie). Is it because of this error or something else? Thanks
/*#cc_on is IE's very own conditional comment - it is executed in IE and ignored in other browsers. If you cannot find uncompressed version of script, you can yust insert line breaks to narrow problematic code.

Cannot access document's title element with jQuery (IE 8)

I'm seeing this issue in Internet Explorer 8, but not in Safari or Firefox. So far, I have not tested in other IE versions.
I am developing my own jQuery plugin and, for this question, I've stripped it down to the two relevant lines.
In IE 8, using the code below, $('title').text() does not do anything. docTitle is blank because title is blank, as if the jQuery selector for <title>, $('title') is not working. (Again, AFAIK, this is just in IE 8)
(function ($) {
$.fn.myPlugin = function (options) {
var title = $('title').text(),
docTitle = escape(title);
};
})(jQuery);
http://jsfiddle.net/sparky672/YMBQ2/
However, using the plain JavaScript code below, document.title is working fine in everything including IE 8...
(function ($) {
$.fn.myPlugin = function (options) {
var docTitle = escape(document.title);
};
})(jQuery);
EDIT:
It does not matter that this code is inside a plugin.
Same result in IE 8 with this...
$(document).ready(function () {
var title = $('title').text();
alert(title);
});
Just to clarify, I am not insisting on using this. In fact, I fixed my plugin by simply using document.title instead. If it wasn't clear initially, I'm just asking why this does not work in IE 8.
Can anyone explain why, or what stupid mistake I may have made here?
EDIT 2:
Here are some jQuery Bug reports on this issue
http://bugs.jquery.com/ticket/7025
http://bugs.jquery.com/ticket/5881
http://bugs.jquery.com/ticket/2755
And dozens of others reporting the same thing. The official response is to state, "document.title is the only reliable cross-browser way and should be used instead" and the Ticket is closed. So there you go.
I guess jQuery iterates over all TextNodes and concatenates its nodeValue. IE stores this value differently than other browsers.
var title = document.getElementsByTagName('title')[ 0 ];
title.firstChild // This would be the Text-Object with the characterdata of the title
// Firefox: [object Text]
// IE: null
This should be the reason you cannot get the textContent with jQuery.text(). title.text seems to be cross browser comp. I only tested it in IE 7 and Firefox 3.6 but you can check the other browser if you like. But why not using document.title?
try using $('title').html() which should work in all browsers

scrollBy doesn't work in Firefox and Opera

This scrollBy function works in Internet Explorer, but ignores by Firefox and Opera. Can anyone help to solve this problem?
function scrollLeft(s){
document.frames['my_iframe'].scrollBy(-s,0);
window.frames['my_iframe'].scrollBy(-s,0);
}
function scrollRight(s){
document.frames['my_iframe'].scrollBy(s,0);
window.frames['my_iframe'].scrollBy(s,0);
}
Here is an example that works in Internet Explorer browser, but doesn't work in Firefox and Opera: http://igproject.ru/iframe-scrolling/index.htm
In Firefox, etc. you need to use scrollTo() instead of scrollBy().
See: http://jsfiddle.net/4CkML/
Example:
window.scrollTo(50,50);
You cannot use scrollTo/By if the domains don't match. You can see here that a javascript error is produced:
http://jsfiddle.net/3CbZc/
Permission denied to access property 'scrollTo'
Edit - Updating answer to incorporate answer from long comment chain:
var oIF = document.getElementById('my_iframe').contentWindow; oIF.scrollBy(s, 0);

Javascript works in Chrome, Safari and Opera but not Firefox

Site here.
Basically the box in the middle doesn't generate random string from my database in Firefox as it does in the other browsers. I can't seem to find the problem, my JS skills aren't amazing.
I haven't tested it in IE as I don't have access to it right now.
Any ideas?
Thank you!
The problem is that form is not defined where you're using it in firefox, you could write it a bit differently to be cross-browser compatible like this:
function get() {
$('#dare').fadeOut(500);
$.post ('data.php', $("form").serialize(), function(output) {
$('#dare').html(output).fadeIn(500);
});
}
The .serialize() function will take every input element in the form a serialize it, resulting in the same request all the other browsers are making...in a lot less code :)
Check the error message in firebug:
form is not defined
$.post ('data.php', {name: form.name.value, mode: mode, player: player},
The following error is generated when you view the site in Firefox:
Error: form is not defined
Source File: http://saucydares.freehostia.com/saucy.php
Line: 29
The line in question is
$.post ('data.php', {name: form.name.value, mode: mode, player: player},
I think the correct method for what you're doing here (if I interpret what you're doing here correctly) is to obtain the form's name with jQuery.

Categories

Resources