I'm using Divi and I can't seem to update the email that shows up in the topbar in the header on the Spanish version of the site. My JS is a little rusty.
The URL is domainofclient.com/es/inicio
The element is <span id="et-info-email">sales#domainofclient.com</span> which needs to change to <span id="et-info-email">ventas#domainofclient.com</span>
What I've tried
<script type="text/javascript">
if(document.URL.indexOf("/es/inicio/") >= 0){
document.getElementById('et-info-email').innerHTML = 'ventas#domainofclient.com'
}
</script>
I've also tried the following JQ
<script type="text/javascript">
if(window.location.href === "https://domainofclient.com/es/inicio/") {
jQuery('#et-info-email').text('ventas#domainofclient.com');
}
</script>
You are almost there. I would although try to first of all wrap the code into a function and run it only when the page is ready.
function replaceEmail() {
if(document.location.pathname.indexOf("/es/inicio") !== -1){
document.getElementById("et-info-email").innerHTML = "ventas#domainofclient.com"
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="author" content="Author">
<title>#[[$Title$]]#</title>
</head>
<body onload="replaceEmail()">
<span id="et-info-email">sales#domainofclient.com</span>
</body>
</html>
I figured it out!
<script type="text/javascript">
jQuery(document).ready(function() {
if(window.location.href === "https://domainofclient.com/es/inicio/") {
jQuery('#et-info-email').text('ventas#domainofclient.com');
}
});
</script>
Related
I'm using Vanilla Javascript,
I have two pages, page01.html and page02.html these pages share the same navigation system.
I want to load a parameter into the url of page01, and after I click page02 on navigation, page02 will load with the parameter within its URL.
example:
I'm on page01.html
I load a param into the URL, so now I have page01.html/?param=X
I click the menu item page02
I want to load page02.html/?param=X
Is there any way to do this without using localStorage and sessionStorage?
Here's a simple solution using vanilla JavaScript:
Page01.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>Page 1</div>
go to page 2
<script>
var linkToPage2 = document.querySelector("a[href='page02.html']");
linkToPage2.addEventListener("click", function(e){
e.preventDefault();
if(location.search){
window.location.href = "page02.html" + location.search;
}
});
</script>
</body>
</html>
Page02.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>Page 2</div>
go to page 1
<script>
var linkToPage1 = document.querySelector("a[href='page01.html']");
linkToPage1.addEventListener("click", function(e){
e.preventDefault();
if(location.search){
window.location.href = "page01.html" + location.search;
}
});
</script>
</body>
</html>
I used both Bergi's comment and Henry's answer to create my own version.
Basically I just created a onclick="menuClick();" and an id="menuLink" on the a tag.
Then on the Javascript I just added the location.search to the href:
menuClick = function() {
document.getElementById('menuLink').href += location.search
}
I have a local non server webpage called DisplayItems.html which pulls a list from another webpage called items.html. I currently had it set up where DisplayItems refreshes its body every x seconds in case items.html got updated. I am trying to lean towards checking if the input has changed every few seconds. If so, refresh the body of DisplayItems, if not, don't refresh. How could I go along of doing this?
DisplayItems.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<link rel="stylesheet" type="text/css" href="Scroll.css">
<script src="jquery1.min.js"></script>
<script type="text/javascript" src="jquery.marquee.min.js"></script>
<script src="jquery-1.12.4.min.js"></script>
<script type="text/javascript">
var jQuery_1_12_4 = $.noConflict(true);
var currentvar;
var oldvar = jQuery_1_12_4('#text').load("items.html");
<!--
function Refresh() {
setTimeout("location.reload(true);");
}
window.setInterval(function Checkforchange(){
currentvar = jQuery_1_12_4('#text').load("items.html");
if (currentvar != oldvar)
currentvar = oldvar;
Refresh();
}, 5000);
// -->
</script>
</head>
<body onload="JavaScript:Refresh();">
<ul class='marquee' id="text">
</ul>
<script type="text/javascript">
jQuery_1_12_4('#text').load("items.html");
</script>
</body>
</html>
Items.html
<li>new item1</li>
<li>senario2</li>
<li>senario3</li>
Maybe something like this? Using your html (get rid of the refresh in the body though, and use Jquery, obviously).
<script type="text/javascript">
function Checkforchange() {
$.get("/refresh/items.html", function (data) {
if ($('#text').html() !== data) {
$('#text').html(data);
window.setTimeout(Checkforchange, 5000);
}
});
}
$(document).ready(function () {
Checkforchange();
});
</script>
I have this div:
<h1>$340</h1>
I need to detect if inside of this div there is a dollar symbol,
If so - remove it
I'll explain again:
I have got this code so far so I manage to detect if the symbol is in the div, but I can't figure how to remove it and update the DOM?
var sign = $('h1').text();
if (sign.indexOf("$") >= 0) {
//remove the sign
}
This is quite easy using a simple regex
var div = $('your selector here');
div.html(div.html().replace(/\$/g, ''));
That's what I have meant, without the If condition:
$('h1').text( $('h1').text().replace("$", ''));
Something like this should work:
$("h1").each(function() {
var $el = $(this);
var text = $el.text().replace("$", "");
$el.text(text);
});
Try like this
var price = $("h1").html().replace(/[^\d\.]/g, '');
console.log(price);
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$( document ).ready(function() {
var val=$('#demo').html().replace('$','');
$( "div" ).replaceWith( val );
});
</script>
</head>
<body>
<h1 id='demo'>$540</h1>
</body>
</html>
Jquery can select based on contents. See https://api.jquery.com/contains-selector/.
What you need to do is:
$( "div:contains('$')" ).remove();
$(function() {
$("#button").click(function() {
var input = $("#input").val();
input = input.replace('$', '');
$("#input").val(input);
});
});
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<title></title>
<meta charset="utf-8" />
</head>
<body>
<input type="text" id="input" placeholder="type here..." />
<button id="button">Remove</button>
</body>
</html>
This is the JQuery approach, I used replace on click on button to remove $ from input.
function HasDollar() {
if($("h1").html().indexOf("$") != -1)
return true;
else
return false;
}
try this.
I want my datepicker to open only under condition, in this case the presence of a class, here's the not working code:
$('.ui-datepicker-trigger').click(function(e){
if ($(this).hasClass('disableDatepicker')) {
e.preventDefault();
}
});
Thanks!
This should be work
$("input").datepicker({
beforeShow: function(a,b){
if ($(this).hasClass('disableDatepicker')) return false;
}
});
http://jsfiddle.net/scTwm/2/
Try with 'not' selector or method
Selector
$('.ui-datepicker-trigger:not(.disableDatepicker)').click(function(e){
//your code
});
Method
$('.ui-datepicker-trigger').not('.disableDatepicker').click(function(e){
//your code
});
It's similar to what you did, you can find a live example here that I've created for you ( http://jsbin.com/kikok/1/ ).
Or check the code that is self explanatory:
$(document).ready(function(){
$(".click").on("click", function(e){
if ( $(this).hasClass("prevent") ) {
console.log("hasClass prevent!");
e.preventDefault();
}
});
});
The html:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<meta name="description" content="" />
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<a class="click" href="//google.com" target="_blank">Click1</a>
<a class="click prevent" href="//google.com" target="_blank">Click2</a>
</body>
</html>
Hope this helps!
If I have some hidden element on a page, that contains some content, how can I create a link and when user clicks it, browser would open a new window and show the content (only the content, for example some json data)?
ps. I know that's probably bad idea to have some hidden content on the page. It's better to put an action link that will get the content from the server.. But it involves many other headaches and it wasn't me who created the page, so please just let me know if there's a comparatively easy solution...
Please use http://okonet.ru/projects/modalbox/index.html with inline content setting
You could pass the (URL encoded) contents of the hidden element as an argument in the URL when opening the second page. That argument could then be (unencoded and) inserted into the body of the second page when it loads.
The following example works locally on OS X. On other operating systems, the example may need to be placed on an actual web server before it will work:
page1.html:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Page 1</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
function openwindow(){
window.open("page2.html?html="+escape($("#myDiv").html()));
}
</script>
<style>
.hidden {
visibility: hidden;
}
</style>
</head>
<body>
Click Me!
<div class="hidden" id="myDiv">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/6e/HTML5-logo.svg/200px-HTML5-logo.svg.png">
<p>See the HTML5 specification</p>
</div>
</body>
</html>
page2.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Page 2</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
jQuery.extend({
// from: http://paulgueller.com/2011/04/26/parse-the-querystring-with-jquery/
parseQuerystring: function(){
var nvpair = {};
var qs = window.location.search.replace('?', '');
var pairs = qs.split('&');
$.each(pairs, function(i, v){
var pair = v.split('=');
nvpair[pair[0]] = pair[1];
});
return nvpair;
}
});
</script>
<script>
$(document).ready(function(){
$(document.body).html(unescape(jQuery.parseQuerystring().html));
});
</script>
<style>
.hidden {
visibility: hidden;
}
</style>
</head>
<body>
<!-- this will be replaced -->
</body>
</html>