JQM How to remove DOM of the previous page with changepage - javascript

I'm currently have an issue with my code.
When I call the changepage method on jquery mobile, my page stay in the dom.
I want to remove that, but I didn't find the answer on internet and stackoverflow.
I tried to $().remove() manually my page, but when I keep back into the page, it doesn't display anything.
Anyone have the solution ?
Thanks for your time.

This may fix your issue:
$('div[data-role="page"]').on('pageshow',function(event, ui){
$(ui.prevPage).remove();
});

Related

Manipulating DOM elements inside an iframe

Im trying to edit a link property, which is inside an iframe. The story behind this issue is that when Im navigating on mobile, an target=_blank is automatically added in my a tag, I this isn't the behavior Im looking for.
The iframe domain is different than mine, I tried to select my link those ways, but never succeed.
$("iframe").find("a").removeAttr("target");
or
$("iframe").contents().find("a").removeAttr("target");
That's the first time Im facing this issue ... Im thinking about some security reasons maybe ? Any help is appreciated.
Cheers.

How to avoid IE redirecting to custom 404 page using javascript

I have below code.
Text
Other browsers just reloads the page when i click on 'Text' but IE11 redirects to my custom 404 page. Can somebody help me to reload the page if the anchor tag is empty and avoid redirecting to 404 page. Is there a way to do this in javascript.
use # inside href, this might do it for you.
Text
Dont Know why you want to do this, this needs to change according to your needs.
Just to keep the answers trivial as your code doesn't really explain the fuller context - would either of these work?
href="#"
href="http://www.absolute.link.to.your.page.html"
Thanks
Finally location.reload() should do it as mentioned in the comments above (Keith)
https://www.w3schools.com/jsref/met_loc_reload.asp

jQuery, Ajax and iOS Issues

Has anyone ever experienced any specific problems relating to the use of jQuery, Ajax events and iOS?
I'm working as a web analyst and on our site we are having issues with iOS in the checkout, we are using jQuery and Ajax events to handle the shopping basket in the background, carry the product information from page to page etc and I'm just taking a stab in the dark because I'm pretty sure it's not the html or css that is causing the issue.
The continue buttons that take you to the next page in the checkout use this href:
Continue
From a little research I found out that a # href just takes the scroll position back to the top, and this does occur on iOS, the html seems to be working, but then the jQuery is supposed to kick in when it detects a click of a href with this class, but it doesn't, scroll position goes back to the top and then nothing happens.
Look I know it's really difficult to make any suggestions without seeing any code, I'm just taking a stab here in the hope someone might go "Oh yeah it could be this".
Try changing href="#" with href="javascript:void(0);"
Add event binding code inside document ready function like this
$(document).ready(function(){
//Event binding code
});

What is causing the links not to work with navgoco slide menu?

I used a demo by jQueryRain to build a collapsible menu with jQuery. When I was done, I realized that none of the links were working. When I went to the documentation page, I found that many users were facing the same problem.
I looked around on StackOverflow and could not find anything that worked. I have tried the following:
This redirects once the page loads
window.location = $(".link-click").attr("href");
These do nothing
$('link-click').trigger('click'); and $('.link-click')[0].click();
Works fine for me. See my fiddle. Do you mind sharing your code? You know you are not supposed to import their demo.js right? Also do you have something like
.click(function(e) {
e.preventDefault();
....
});
in your code? preventDefault() blocks the default behaviour of anchor tag, which is to redirect. This is in their demo, which you may have copied and pasted? What did you assign to active_menu_cb?

Div not properly hiding in IE

I've got few divs on my website - on the load I want some of them to be hidden, some shown. I am hiding the ones I don't want like this:
$(".divToHide").hide();
It works well in Chrome, Firefox, IE8 an Opera... It doesn't in IE6 (I haven't tested on previous version yet...) - when I load the page all the divs are hidden properly. When I click a link that makes one of them visible it appears correctly. The problems shows when I click on a different link that's supposed to hide the first div and show another. The text of the first div is hidden, but the image stays and obstructs the newly shown div. I'm pretty sure it's a bug - when I zoom in or out of the page the divs that were supposed to be hidden disappear suddenly - they're only visible when I load the page.
Is there a way around it?
EDIT: I'm using jQuery v1.3.2
EDIT: Unfortunately the solution of using addClass to add css class that states display: none doesn't really work - it seemed like it did at first, but the problem is still there.
UPDATE: The js file I wrote can be found here, while the html here. The problem I have is that when you go from one portfolio to the other, the image of the first one stays there obstructing the next, even though it should be hidden (text underneath changes correctly). Wrong disappears when you try to zoom in/out of the page.
I used to hide all portfolios using $("#divId").hide(), but as was pointed out below, I now use $(".classToHide").hide().
UPDATE: The problem is solved on IE8 - I forgot to include the standards mode declaration... However, on IE6 it's still the problem.
You're hiding multiple div's by using an ID selector?
Try giving those div's a class "divToHide" and then use:
$(".divToHide").hide();
Maybe IE8 handles duplicate id's in another way than those other browsers..
Just a thought: you're not using an old (pre-IE8) version of jQuery, are you?
Edit: No, grycz is using the current version.
Edit: simplified to use toggleClass()
You could try doing it manually, like toggling a css class called "hidden." It might look something like this:
function myToggle(element_id)
{
mydiv = $('#' + element_id);
mydiv.toggleClass("hidden");;
}
And your css file would have:
.hidden
{
display:none;
}
I haven't tested this, but this is the kind of workaround I imagine you'd want to think about if this is, indeed, a bug in jQuery/IE8.
Are you sure that hide() function call is even getting called on the page load? Try putting an alert('hi') right before that function call, and see if that happens in IE8.
try
$("#divToHide").css('display:none');

Categories