I have a script that is now working, but there's still conflict with other scripts on page that I have no control over... (hosted e- site with limited access) - is there a way to acplish this, but with plain javascript?
var $b = jQuery.noConflict(true);
var d = new Date();
var dayOfWeek = d.getUTCDay();
var hour = d.getUTCHours();
var mins = d.getMinutes();
var status = 'open';
if (dayOfWeek !== 6 && dayOfWeek !== 0 && hour >= 12 && hour < 22)
status = 'open';
else
status = 'closed';
if (status=='open')
$b('.orderby').show();
else
$b('.orderby').hide();
I have a script that is now working, but there's still conflict with other scripts on page that I have no control over... (hosted e- site with limited access) - is there a way to acplish this, but with plain javascript?
var $b = jQuery.noConflict(true);
var d = new Date();
var dayOfWeek = d.getUTCDay();
var hour = d.getUTCHours();
var mins = d.getMinutes();
var status = 'open';
if (dayOfWeek !== 6 && dayOfWeek !== 0 && hour >= 12 && hour < 22)
status = 'open';
else
status = 'closed';
if (status=='open')
$b('.orderby').show();
else
$b('.orderby').hide();
Share
Improve this question
edited Jul 21, 2016 at 13:52
Mohammad
21.5k16 gold badges56 silver badges84 bronze badges
asked Jul 21, 2016 at 13:48
M21M21
3434 silver badges17 bronze badges
5
- 4 Possible duplicate of Show hide divs on click in HTML and CSS without jQuery – NIKHIL RANE Commented Jul 21, 2016 at 13:49
- 1 what is the conflict? – epascarello Commented Jul 21, 2016 at 13:50
- @NIKHILRANE - I need it to be timed, not on click. So it's different than what you posted. – M21 Commented Jul 21, 2016 at 13:51
- @epascarello - not sure, but it breaks the cart & checkout pages, for which I have limited access, so I cannot change that, I must change this script, since it is what I do have access to. – M21 Commented Jul 21, 2016 at 13:52
-
if you have a
.hidden
class you can use something like this: stackoverflow./questions/35467207/… – JKirchartz Commented Jul 21, 2016 at 13:52
4 Answers
Reset to default 7You only have 1 tiny bit of jquery in your code
if (status=='open') {
$b('.orderby').show();
}else{
$b('.orderby').hide();
}
This can be converted to (updating to JQuery equivalent):
if (status=='open') {
document.querySelector('.orderby').style.display = "block";
}else{
document.querySelector('.orderby').style.display = "none";
}
You can use this:
var elem = document.querySelector(".elementClass");
elem.style.display = (status === 'open') ? 'block' : 'none';
Yes. You can use querySelectorAll
to get elements and loop over them and add a class that will set display: none
.
show
var el = document.querySelectorAll(".orderby");
for(var k in el){
el[k].className = el[k].className.replace("hide", "");
}
hide
var el = document.querySelectorAll(".orderby");
for(var k in el){
el[k].className += 'hide';
}
you could use this:
if (status=='open') {
document.getElementsByClassName('orderby')[0].style.display = "block";
}else{
document.getElementsByClassName('orderby')[0].style.display = "none";
}