Javascript does not work in IE8 - javascript

The following JavaScript works on IE7 but not on IE8:
onclick=history.back(1) or history.go(-1)
Any suggestions on why this is the case and how to overcome it.

Have you tried:
onclick="history.back()"
with the quotes?
And, responding to your statement that it doesn't work: au contraire, mon ami.
The following two files run fine on my IE8 install, using the files x1.html:
<html><head></head><body>
X1
<hr>
x2
</body></html>
and x2.html:
<html><head></head><body>
X2
<hr>
<button onclick="history.back()">Back!</button>
</body></html>
When I load x1, I can move to x2 with the link, then the button moves back to x1.
This works in all three compatibility modes, ergo it must be a setting on your browser which is affecting this.
One thing I had to do to get this to work was to go to Tools -> Internet Options -> Advanced -> Security and select Allow active content to run in files on My Computer, so it's almost certainly a security setting in your browser which is causing you grief.

i used this and works well :
<asp:Button ID="Back_BTN" runat="server" Text="بازگشت"
onclientclick="javascript:history.back(1);return false;" />

I also had this problem. Never check its also the same on ie7 or not
Code like below cant run on IE8. Can on FF3.5
<select size="2">
<option onclick="alert('hey hey')">Hey hey</option>
<option onclick="alert('a ha')">A Ha</option>
</select>
However, this on work
<select onclick="alert('uh oh')" size="2">
<option>Hey hey</option>
<option>A Ha</option>
</select>

I had the same problem and solved it like this...
<input type="button" value="Back" />
You need to put history.back() into your a href tag and also the onclick event.

Try history.back(), if that doesn't work then try this history.back();return false;

It may be a simple reversal of quotes. Try this
lblmessage.Text += '<br> <u>Back</u>'
instead of this
lblmessage.Text += "<br><a href='#' onclick='history.back(1);'> <u>Back</u></a>"

This isn't the answer, but maybe it will help someone else dig up the real answer... The issue might be related to IE8's compatibility mode. Weird things happen in IE8 based on the DOCTYPE of the web page. If your DOCTYPE is Transitional, IE8 might not properly handle the onclick event.

Related

Why do I get this <br> element in a contenteditble div?

I have a div element that looks like this
<div id="test" contenteditable="true" style="height: 17px;">
</div>
When I do $("#test").html(), I'd expect to see an empty string returned, but in fact, it gives me <br>.
Why would there be a <br> even if I haven't put any there in the div?
Edit: Actually, in between the div tag, I have a Struts2 property tag which outputs a value but this value populated in the backend is empty so I was not expecting to see <br> there.
It's look like strange issue, As far my experience it can be due to these stuff
It may be html tags are not closed
You may have some browser extension which some time do these type weird stuff
so try to disable all extension and check all html tags also try in incognito mode after disable extension, I think it may help you for debugging this issue.
https://jsfiddle.net/47r6p89r/
There is space between <div ...> and </div>.
Also spaces will be detect by HTML but only one by one. The weird thing is that you got
<br>
as output I just got nothing as in the fiddle.
Here like in my fiddle you can detect if #test is empty if not you can see the result.
$(document).ready(function() {
if ($('#test').html() !== "")
$('#console').text($('#test').html());
else
$('#console').text('empty');
});

My Javascript code doesn't work in chrome

I write ajax on my page, to get subcategories in select option, depending on categories option list click. In all browsers it works good, i can see my request, response in browsers console... but in chrome functions even doesn`t call. Dou you know, in what the problem is? Here is my code:
<td>
<span style="color: #898989;">Main categories</span>
<br />
<select style="width: 200px;">
<?foreach ($main_categories as $item){?>
<option onclick="get_sub_cat(<?=$item['id']?>,2);return false;" value="<?=$item['id']?>"><?=$item['title']?></option>
<?}?>
</select>
</td>
<td>
<span style="color: #898989;">Subcategories</span>
<br />
<select name="sub_cat" style="width: 200px;" id="prod_subcat_2">
</select>
</td>
function get_sub_cat(id, select_id){
$.ajax({
type: "POST",
url: "<?=base_url()?>admin/product/get_sub_cat/"+id,
data: "",
success:function (option_list) {
$("#prod_subcat_"+select_id).children().remove();
$('#prod_subcat_'+select_id).append(option_list);
}
});
}
An <option> elements onclick is not universally supported, instead use an event of the parent <select>
$('#theselect').change(function() {
alert( $(this).val() );
});​
1) If you run on local folder and not running on server, then chrome have security reasons not to run these type of javascript calls. There is multiple threads around stack overflow about running localy javascript ajax calls on chrome if thats the case.
2) Try your javascript with simple alert("hey"); to check if javascript is working or its the ajax.
3) If javascript works. Use google "Developer tools" ctrl+shift+i, set breakpoint on your javascript call and check what get passed as variable and wheres the problem.
4) If javascript dont work try this http://support.google.com/chrome/bin/answer.py?hl=en&answer=114662
Try attaching an onchange event handler and getting the selected element from the select element passed into on the event. It probably doesn't make sense to attach event handlers to individual options.
You need to add some quotes :
get_sub_cat(\"<?=$item['id']?>\",2)
you need to send this parameter as a string.
Are you sure your JavaScript is in a <script> tag ? the question doesnt show it
<script>
// your javascript
</script>

Firefox 10 - unclickable buttons?

Has anyone seen this behavior:
I have a couple of HTML buttons used to drive a content rotator:
<div id="rotatorControls" class="rotatorControls" runat="server">
<input name="previous" id="previous" type="button" value="«" />
<input name="next" id="next" type="button" value="»" />
</div>
The buttons are activated with a little jQuery:
$(document).ready(function() {
mcarousel = $("#carouseldiv").msCarousel({ boxClass: 'div.box', height: 100, width: 450 }).data("msCarousel");
//add click event
$("#next").click(function() {
//calling next method
mcarousel.next();
});
$("#previous").click(function() {
//calling previous method
mcarousel.previous();
});
})
In IE this works fine...in Chrome and FireFox 10, the buttons aren't clickable. When I roll my cursor over the buttons, the cursor doesn't change and the buttons don't highlight like other buttons do.
Anyone seen this before and/or have any ideas how to fix this? I've already tried setting the z-index on the buttons, and moving them out of the container div (thinking an invisible element is blocking the click), but neither of those worked.
Any help would be appreciated.
EDIT
I'm using the mCarousel plugin provided by Marghoob Suleman (http://www.marghoobsuleman.com/jquery-ms-carousel)
At a guess without the full code, I would suggest checking the relevant js files have loaded correctly for this plugin in Firefox and Chrome. Also it would be worth noting in the question that it is via a plugin not standard jQuery that this functionality is from.
Maybe you're missing something from the original implementation:
http://www.marghoobsuleman.com/mywork/jcomponents/carousel/index.html
For example the boxClass: 'div.box' pointing to the wrong place.
I had this same problem yesterday with a late version of Firefox and I found help on this site from Mikey G.
This may help if you want to go this route, it worked for me on a similiar issue, also with a slideshow.
Place your functions inside the buttons:
<input name="next" id="next" type="button" onclick="$mcarousel.next();" value="»" />
Forgive me if I left out a character or two, still pretty new.
It doesn't seem to be z-index, I've found info that suggests sometimes Firefox has problems with '.click()'

jquery before() is out of order?

I have a page where you can click a link that says "add a keyword" and an input will appear and you can enter the keyword, and then convert it into a span tag on blur or the "return" key. However, I've been adding onto it to allow for an "autocomplete" feature, so I'm trying to insert a
<ul></ul>
after my input in order to do a .load inside the list.
The relevant code I have is:
var addKeywordId = 0;
$('a.add_keyword').live('click', function(){
$(this).before('<input type="text" class="add_keyword" id="addKeyword'+addKeywordId+'" /><ul><li>hi</li></ul>');
$('.add_keyword').focus();
addKeywordId++;
});
The problem is, that my HTML structure ends up looking like this:
<ul><li>hi</li></ul>
<a class="add_keyword">+ add keyword</a>
<input id="addKeyword0" class="add_keyword" type="text />
INSTEAD OF
<input id="addKeyword0" class="add_keyword" type="text />
<ul><li>hi</li></ul>
<a class="add_keyword">+ add keyword</a>
Anybody know why my HTML is added out of the order I specified??
Thanks
EDIT: This seems to be working fine in Google Chrome, but not in Mozilla Firefox.. :(
This is likely due to the weird rejiggering of code Firefox does to try to display things even when there are errors. I've seen it where I miss a closing div, IE freaks out (as it should) and Firefox looks fine, as it ignores that you missed adding the ending div and guesses.
You could try a 2 stage thing. I would add an id to the ul tag, then add the input before it.
$(this).before('<ul id="ulid"><li>hi</li></ul>');
$('#ulid').before('<input type="text" class="add_keyword" id="addKeyword'+addKeywordId+'" />');
Happy haxin.
_wryteowl

Jquery Selector not working in IE7

For the following HTML
<div id='parent'>
<input id='child' type=hidden value=''/>
</div>
I am doing
$('#parent #child').val('test')
OR
$('#parent > #child').val('test')
but none of the above is working in IE7. It does work in Firefox though
Any idea why is it not working ?
is it because you've got the HTML wrong? You should use " for attribute values. Sometimes IE is more sensitive to these things than Firefox
Your syntax seems correct. The only stuff I can think of that can muck this up are:
Make sure you've got your code between a $(document).ready() block
Maybe try .prop() instead of .attr() if you're using jQuery 1.6+
Try $('#child').val('test'); which would probably give the same result.

Categories

Resources