This code worked in IE, FF, and Safari (windows7).
It is not working in Chrome however.
Basically, I am trying to make some changes on page load (Magento product page). I change the selected option (of a hidden select dropdown), then when they hover over the Add to Cart button, I make sure that an option was selected.
Code below:
$j('select#attribute76').val( $j('a'+hash).attr('index') ).change();
alert($j('select#attribute76').val()); // shows correctly w/ all browsers
... then later on ...
$j('#addtocartbutton').hover(function(){
//alert($j('select#attribute76 option:selected').val());// empty in Chrome!
if ($j('select#attribute76').val()=='')// empty in Chrome!
$j('.infoOptionsColors a:first').click();
});
What is happening is that Chrome is selecting the option that I am asking it to, but it reverts back somehow... perhaps there is another call that is overriding it..
I still do not know what the problem was.
I resolved it by moving my code towards the end of the javascript calls more.
The code that I moved it after seems barely related.. assigning the more to the .click function which is just adding/removing classes, and not changing any form values. + some vide code..
Thanks @clockworkgeek for trying to help.