My coding isnt linking properly , its meant to use jquery to detect the OS and change the link accordingly , however it isn't.
In my HTML page I have it linked in the header as
<script src="jsquery.js" type="text/javascript"></script>
which loads up my jsquery now
$(document).ready(function() {
if (navigator.appVersion.indexOf("Win") != -1) {
// Computers runs windows
$("a[href$='.pdf']").each(function() {
this.href = this.href.replace("Volumes", "KP01DS0194TG");
});
}
if (navigator.appVersion.indexOf("Mac") != -1) {
// computer is a Mac
$("a[href$='.pdf']").each(function() {
this.href = this.href.replace("KP01DS0194TG", "Volumes");
});
}
});
Yet on Mac's it still tries to connect to KP01DS0194TG and not to Volumes - it doesnt change it - how can I get it to recognize the OS and change it accordingly?
I believe that you are improperly linking to jquery. I would think it should be jquery.js not jsquery.js. Try changing the link in the header to this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
Related
This is an ASPX page and rarely the stylesheets do not load. No Request either. I can look at the network log in chromes debug and see that it didnt request it or load it from cache. Everything else, img , js, whatever all loads without problem. The only thing that this site does that I have never done before is load a stylesheet via javascript and that will request and work every time. There is also an Iframe in the page and that css always works as well. It feels like a 1 in 10 chance for this to happen, but its random. I cant remember if it happens when i run it locally or not, but it will happen on the 3 different IIS servers. In the sources of the Chrome DevTools it shows the file in there as well. Is this a bug in chrome or something? Is it a weird thing with closing tag in the links? Has anyone seen this before?
<head>
....
<link type="text/css" rel="stylesheet" href="~/css/site.min.css?v=#Model.buildTag" />
<link href="~/lib/tabulator/css/tabulator.css" rel="stylesheet" />
<link id="glcss" type="text/css" rel="stylesheet" href="/css/empty.css">
</head>
This JS code runs mid way trough the initial js load of the page before doc render and it sets a stylesheet to the page. Not sure if this would cause chrome to randomly abandon the other css documents. This css always works.
var stylesheetPath = _pth + "/css/custom_gl_theme_" + dd.value + ".min.css?v=" + _v;
$('link[id="glcss"]').attr('href', stylesheetPath);
this.value = dd.value;
Still don't know the cause, but this is the solution we had put in place. Basically, once the page loads, we check to see if those css files loaded properly, and if not, reset the url and it would force the pull.
$(window).on('load', function (e) {
var links = document.getElementsByTagName('link');
for (var i = 0, linkLen = links.length; i < linkLen; i++) {
var link = links[i];
if ((link.id == "") && (link.type == "text/css")) {
var cssHref = link.href;
link.href = cssHref;
}
}
});
Hi I'm trying to load an element from a webpage via ID.
My code reads the url from the 'href' attribute of the tag and then loads the page. I'm stripping the document anchor.
This script works but won't discard the surround elements and loads the entire page.
<script type="text/javascript">
$(function() {
var a_href = $('#pycom').attr('href').split('#');
$('div#pop-up').load(a_href[0] + '#synopsis');
});
</script>
<body>
<a id="pycom" href="content/documentation/CommandsPython/ls.html#hFlags">ls</a>
</body>
http://help.autodesk.com/cloudhelp/2015/ENU/Maya-Tech-Docs/CommandsPython/ls.html
The above link exists locally on my server (XAMPP) as per the 'html' code above.
Below is the element I would like to extract.
<p id="synopsis">
<code>
xform([objects...],
[absolute=<i>boolean</i>],
[boundingBox=<i>boolean</i>],
.....
.....
</code>
Thanks
Jamie
At first get your page, and then inside the
content find your element with id named 'synopsis' as below:
var a_href = $('#pycom').attr('href').split('#');
$("div#pop-up").load(a_href[0] + " #synopsis" );
It should work, but before that check whether your browser supports mixed content. If your url contains http inside https then browser may not support, In that case you have to disallow the checking in the browser.
Thanks.
OK solved. I was using jQuery 2.4.1 which apparently has a bug that is supposed to be fixed.. but appears to be not?? see here http://bugs.jquery.com/ticket/14773
I am instead using jQuery 1.11.3
below is my final code:
<script type="text/javascript" src="content/scripts/jquery-1.11.3.js"></script>
<script type="text/javascript">
$(function() {
var moveLeft = -10;
var moveDown = 10;
$('a#pycom').hover(function(e) {
var a_href = $(this).attr('href').split('#');
$('#pop-up').load(a_href[0] + ' #synopsis');
$('div#pop-up').show().css('top', e.pageY + moveDown).css('left', ((e.width/100)*1) + moveLeft);
}, function() {
$('div#pop-up').hide();
});
});
</script>
The following method using .get also works exactly the same except gives the benefit of being able to process the returned string in the callback.. in this case the trailing section of the requested selected element... very nice stuff.
$('a#pycom').hover(function(e) {
var a_href = $(this).attr('href').split('#');
$.get(a_href[0], function(response) {
$('#pop-up').html($(response).filter('#synopsis').html().split('<br>')[0]);
});
});
Now owning jQuery like a BOSS!!
Thank you to all those who helped out.
Chur!
J
You should not give any space in the URL. There is a space before ' #synopsis'.
$('div#pop-up').load(a_href[0] + '#synopsis');
Basically I'm trying to build a functionality in which I only really edit my index.php, I got a lot of other php files with just a form in them or just a few lines of text.
What I want to achieve is to load these other files in the contentwrapper of my index.php.
I have been successfull on doing this with an iframe and with a html <object>.
The problem with these though is that first of all they load an all new #document in the DOM, and also my webpage has no set height so height: 100% won't work on those and I would get these ugly scrollbars and stuff.
after searching a lot on SO today I found a few interesting solutions which I combined, this is what I'm trying now:
<script type="text/javascript" href="js/csi.min.js"></script>
<script type="text/javascript">
function load_content(target){
document.getElementById('contentwrapper').innerHTML='<div data-include="' + target + '" ></div>';
return false;
}
</script>
now you may question what data-include is, this is a very nice workaround I found on SO.
THIS is what it does, it basically calls a .js file that replaces the containing element with the data that is in the file (target in the above example)
I call this functionality like this:
Update profile
It works as far as adding this to the DOM:
<div id="contentwrapper">
<div data-include="update.php" ></div>
</div>
but besides that it does nothing, I think that it doesn't call the .js file for the data-include attribute. But I can't find a solution for this nowhere.
(BTW: the data-include attribute does work if I put it in a tag manually without javascript)
I Hope I didn't overexplain the situation, and I thank everyone that tries to help in advance!
The csi.js script is only run once after the page is loaded. It just goes over all the elements with the data-include attribute and runs the fragment function.
<script type="text/javascript">
function fragment(el, url) {
var localTest = /^(?:file):/,
xmlhttp = new XMLHttpRequest(),
status = 0;
xmlhttp.onreadystatechange = function() {
/* if we are on a local protocol, and we have response text, we'll assume
* things were sucessful */
if (xmlhttp.readyState == 4) {
status = xmlhttp.status;
}
if (localTest.test(location.href) && xmlhttp.responseText) {
status = 200;
}
if (xmlhttp.readyState == 4 && status == 200) {
el.outerHTML = xmlhttp.responseText;
}
}
try {
xmlhttp.open("GET", url, true);
xmlhttp.send();
} catch(err) {
/* todo catch error */
}
}
function load_content(target){
fragment(document.getElementById('contentwrapper'), target);
return false;
}
</script>
Then call it like this:
Update profile
So, the only thing you need is to call this function for the new created element. Pass the DOM element and the url to this function and it will take care of loading the contents of the requested resource in the corresponding element.
May we assume that you followed this advise from the repository: The only caveat is Chrome, which restricts access to local files via AJAX. To resolve this, simply add --allow-file-access-from-files to your Chrome runtime.
If you didn't, and you're using Chrome, then this stands out to me, and you didn't indicate that you'd corrected the security block that Chrome puts in place.
The csi.js only runs on window.onload.
Try
<a href="#" onclick="function() {load_content('update.php'); window.onload(); }">
Update profile</a>
I'm trying to force an update of my jQuery page before I want to change the page.
Code looks like this:
function popupOrRedirect2() {
location.reload();
var content = document.getElementById('invisibleDiv').innerHTML;
if (content > 0) {
$.mobile.changePage("http://localhost:8080/application/test");
} else {
$("#popupDialog4").popup("open");
}
}
I need to read a value from a hidden div, but the div gets updated only after the page is getting reloaded. I must ensure to have the latest value.
The problem is, it doesn't work. If I remove the location.reload() it works... but it doesn't have the newest value.
Any hint on how to achieve the behavior that I want?
I'm using jQuery mobile 1.8.3.
A quick and dirty way might be to use URL params to determine whether to reload.
Instead of:
location.reload()
you could do:
if (location.search !== '?reloaded=1') {
location.search = "reloaded=1"; //triggers a reload once
}
i am trying to call a external HTML page to be displayed on website based on javascript conditions.
The code is like this
<script language="JavaScript" src="http://j.maxmind.com/app/country.js"></script>
<script type="text/javascript">
var country = geoip_country_code();
if (country == "US")
{
document.write("http://www.mywebsite.com/1.html");
}
else if (country == "GB")
{
document.write("<a href='#'><img src='http://www.image2.com' ><a/>");
}
else
{
document.write("<a href='#'><img src='http://www.image3.com' ><a/>");
}
</script>
Now, instead of showing the content of HTML page to US visitors, it just display "http://www.mywebsite.com/1.html" as plain text.
I am missing a function to call external HTML. Can someone help? Thanks
Do you mean the <iframe> element?
document.write('<iframe src="http://www.mywebsite.com/1.html"></iframe>');
Since <iframe> cannot resize itself to match the size of its content, be sure to give it a width/height attribute or style (if you know the actual size of content).
Spitting the text of a URL into a page doesn't magically grab the contents of that page. This type of activity usually happens on the SERVER where your server will fetch the content from another page and serve it up as part of YOUR page. JavaScript is the wrong tool for this job.
this kind of thing is really better to do server-side with stuff like php but here's a function I use in a lot of my commercial jobs. Again, I don't condone the use of this function for loading entire pages, but it's a really handy one to have in your toolbox. If anyone says you have to use JQuery to do this, kick them for me. ^_^
function fetchHTML(url)
{
if( 'undefined' == typeof(url) ) return false;
if( document.all ){
p = new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
p = new XMLHttpRequest();
}
rnd = Math.random().toString().substring(3);
if( url.indexOf('?') > -1 )
{
url+='&rnd='+rnd;
}
else
{
url+='?rnd='+rnd;
}
p.open("GET",url,false);
p.send(null);
return p.responseText;
}
well, you are giving a string to document.write() function, and that's why it is displaying the string that it was supposed to display. If you want to display content of some other page you have two choices either you can use an <iframe> or use ajax.