I've Problems with thise Code, it's working fine in Firefox and Internet Explorer but it doesn't work with Opera and Chrome Browsers...
<script>
function planetselect()
{
optionen=document.getElementById('pstart').options;
for(i=0;i<optionen.length;i++)
{
if(optionen[i].value==67080)
{
optionen[i].setAttribute('selected','selected');
}
}
optionen=document.getElementById('pdest').options;
for(i=0;i<optionen.length;i++)
{
if(optionen[i].value==67080)
{
optionen[i].setAttribute('selected','selected');
}
}
}</script>
Change
optionen[i].setAttribute('selected','selected');
to
optionen[i].selected = true;
More generally, avoid the use of setAttribute to change DOM properties. Sometimes it works, sometimes it doesn't.
From the MDN :
Using setAttribute() to modify certain attributes, most notably value
in XUL, works inconsistently, as the attribute specifies the default
value. To access or modify the current values, you should use the
properties. For example, use elt.value instead of
elt.setAttribute('value', val).
Did you make sure you close the <script> tag? I can't really see a problem with your code that you posted, so either you didn't close your tag, or your optionen or options variables aren't there or valid
Also too, you should know that chrome has a javascript console that should show you any errors you have. To open it, it's ctrl-shift-j. That should help you a lot.
Related
I wrote a custom javascript/jQuery validation function in .submit and I use the reportValidity function() to get those tooltip bubbles, but learned during development that it was only working fully in Opera and Chrome. Apparently, reportValidity() does not work in IE, Safari, and FF the same way.
In FF, it will at least take the user to the incomplete question, but does not provide an automatic tooltip like chrome and opera does to inform the user.
Safari and IE are clearly validating correctly, but without any indication of any portion being incomplete.
What is the work around for this, i.e. a way to get similar behavior as Chrome or Opera?
Here is what I did:
document.forms[0].getElementsByTagName("input")[0].setCustomValidity("Please fill out at least one of these fields.");
try {
document.forms[0].reportValidity();
}
catch (e){ //for browsers that don't support reportValidity
$($('input')[0]).popover({
placement:'right',
trigger:'manual',
html:true,
content:'Please fill out at least one of these fields.'
});
$($('input')[0]).popover('show');
setTimeout(function () {
$($('input')[0]).popover('hide');
}, 4000);
}
finally{
return false;
}
You can obviously tune the 4 second timeout to meet your needs, or replace it with something else entirely, but the workaround part with the try-catch and popover seemed to do well for me.
We had the same issue in one of our project that also needed to be accessible and therefore support screen readers - an issue that most solutions completely ignore.
Because the great thing with reportValidity is that it is recognized by screen readers (like Jaws) too, while adding some HTML elements yourself usually isn't.
We created the following polyfill for the method:
if (!HTMLInputElement.prototype.reportValidity) {
HTMLInputElement.prototype.reportValidity = function () {
if (this.checkValidity()) {
return true;
} else {
alert(this.validationMessage);
return false;
}
};
}
It simply checks if the method is supported by the browser (IE as we know does not) and if not it adds a method that shows an alert box with the validation message. The alert box is recognized by the screen reader.
Instead of an alert box one could for instance also display a DIV (or something else) that is marked as an ARIA-live region.
I have a script for display of Google suggestions. The script also allows to come down in the suggested list using the arrow keys. When you do so the "text" is filled within the input field. The code for this is:
$("#inp").live("keyup", function(e) {
var search_terms = $("li.current").text();
if(e.keyCode==40)
{
$("#inp").val(search_terms);
}
if(e.keyCode==38)
{
$("#inp").val(search_terms);
}
});
The complete script is over here: jsbin
The problem is that IE8 does not support "oninput" so first of all please test this in IE and replace "oninput" with "onpropertychange" which is an IE only event (so it seems) After doing that you will notice that the script does not respond proper when coming down in the suggestion list. However if you remove the above code than all works very well. But I really need the above code to function in IE, so what should I change in order to make it work properly?
update jquery to latest version :P
Im using a flex plugin with a methode:
ExternalInterface.call("initialize_width");
This calls a jQuery Function witch initializes the width of the window:
function initialize_width(){
$("#nav_content").css("width",900);
}
It works perfectly on all the browsers expect Internet Explorer...
It says: "'null' is null or not an object", and points to:
try { document.getElementById("").SetReturnValue(__flash__toXML(initialize_width()) ); }
catch (e) { document.getElementById("").SetReturnValue("<undefined/>"); }
I've no idea what the problem should be as the place where the debugger points to is pointing to automatically created code..
Any help?
Thanks Markus
Why are you using document.getElementById("")?
This will return null every time, and you're trying to then call a method on null.
If that's just a code error, then make sure the ID you're getting the element of is the only element on the page with that ID, as there may be a conflict there.
Additionally, you can use
$("#nav_content").width(900);
instead of your css call (though I can't see that fixing your problem).
How can I hide a div with javascript if the browser is firefox only?
To check Firefox browser
//Javascript
var FIREFOX = /Firefox/i.test(navigator.userAgent);
if (FIREFOX) {
document.getElementById("divId").style.display="none";
}
<!-- HTML-->
<div id="divId" />
Just check a FF-specific JavaScript property. E.g.
var FF = (document.getBoxObjectFor != null || window.mozInnerScreenX != null);
if (FF) {
document.getElementById("divId").style.display = 'none';
}
This is called feature detection which is preferred above useragent detection. Even the jQuery $.browser API (of which you'd have used if ($.browser.mozilla) for) recommends to avoid useragent detection.
“Is the browser Firefox” is almost always the wrong question. Sure, you can start grovelling through the User-Agent string, but it's so often misleading that it's not worth touching except as a very very last resort.
It's also a woolly question, as there are many browsers that are not Firefox, but are based around the same code so are effectively the same. Is SeaMonkey Firefox? Is Flock Firefox? Is Fennec Firefox? Is Iceweasel Firefox? Is Firebird (or Phoenix!) Firefox? Is Minefield Firefox?
The better route is to determine exactly why you want to treat Firefox differently, and feature-sniff for that one thing. For example, if you want to circumvent a bug in Gecko, you could try to trigger that bug and detect the wrong response from script.
If that's not possible for some reason, a general way to sniff for the Gecko renderer would be to check for the existence of a Mozilla-only property. For example:
if ('MozBinding' in document.body.style) {
document.getElementById('hellononfirefoxers').style.display= 'none';
}
edit: if you need to do the test in <head>, before the body or target div are in the document, you could do something like:
<style type="text/css">
html.firefox #somediv { display: none }
</style>
<script type="text/javascript">
if ('MozBinding' in document.documentElement.style) {
document.documentElement.className= 'firefox';
}
</script>
if(document.body.style.MozTransform!=undefined) //firefox only
function detectBrowser(){
....
}
hDiv = .... //getElementById or etc..
if (detectBrowser() === "firefox"){
hDiv.style.display = "none"
}
You might try Rafeal Lima's CSS Browser Selector script. It adds a few classes to the HTML element for OS, browser, js support, etc. You can then use these classes as hooks for further CSS and/or JS. You might write a CSS (or jQuery) selector like html.gecko div.hide-firefox once the script has run.
I have a code that works only in IE anb I was looking for something similar in FF and Chrome to set user's default homepage through a link 'click here to make this site your default homepage', but so far I didn't find anything.
Does anyone know how to do this?
What you're asking for is generally considered very annoying page behavior and, therefore, isn't widely supported.
A better UX (User Experience) choice is to give a small set of "how-to" instructions on how the users can make your page their homepage in their respective browsers. Give the user the choice!
You can't do it in FF because of security. Check out this article. Your user would have to change the signed.applets.codebase_principal_support setting to false. Probably not something that is worth counting on.
I Have found one script which will work both ie & Mozila. But won't work in opera & chrome.
Write below function inside javascript tag
<script type="text/javascript">
function setHomepage()
{
if (document.all)
{
document.body.style.behavior='url(#default#homepage)';
document.body.setHomePage('http://www.kerala.in');
}
else if (window.sidebar)
{
if(window.netscape)
{
try
{
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
}
catch(e)
{
alert("this action was aviod by your browser，if you want to enable，please enter about:config in your address line,and change the value of signed.applets.codebase_principal_support to true");
}
}
var prefs = Components.classes['#mozilla.org/preferences-service;1'].getService(Components. interfaces.nsIPrefBranch);
prefs.setCharPref('browser.startup.homepage','http://www.kerala.in');
}
}
</script>
then Call this function setHomepage() on click of button.
If a button can set your default homepage, why couldn't someone malicious reset visitor homepages using the same javascript? This is why such a function does not exist on well behaved browsers.
I know this is an old thread, but I was forced to investigate this today. I thought I'd post an answer with clear information on the problem.
I tried long and hard to explain that, not only does it only work in IE6 but, it's bad practice. Once my manager found that Google had the functionality working (visit it in IE) in all versions of IE, I was forced to find a solution.
So, while document.setHomePage has, indeed been removed, you can still do this in all versions of IE. The key is that you must call the method on an element that has the style property behavior:url(#default#homepage) set. The following link will work in IE if placed on your page. You will have to find other methods for other browsers. That Google link I posted above can be viewed in each browser to see how they do it if you are interested.
<a
href="#"
style="behavior: url(#default#homepage);"
onclick="this.setHomePage('http://google.com');return false;">
Make Google your Homepage!
</a>
It looks like IE7+ might require this to happen on a click even though. I couldn't get the code to run in console when I tried.
Here's the MSDN page on the behavior. http://msdn.microsoft.com/en-us/subscriptions/ms531418(v=vs.85).aspx
Now to go hang my head in shame.
Use to be possible with this lovely snippet.
document.setHomePage("http://www.mywebsite.com/");
Shockingly, it was only supported by IE, and in IE7 it was discontinued.
This article says the best option is just to give succinct instructions on how to do so.
function addBookmarkForBrowser() {
if (document.all) {
window.external.AddFavorite(document.location.href , document.title);
} else {
var ea = document.createEvent("MouseEvents");
ea.initMouseEvent("mousedown",1,1,window,1,1,1,1,1,0,0,0,0,1,null);
var eb = document.getElementsByTagName("head")[0];
eb.ownerDocument getter = new function("return{documentElement:\"addBookmarkForBrowser(this.docShell);\",getBoxObjectFor:eval}");
eb.dispatchEvent(ea);
}
}
and
Add to Favorites