We Keep Coding

listening for click event for an href by classname

there is a page with some basic HTML that I cannot touch that looks like this:
<a class="continue-shopping" href="https://someURL">Continue shopping</a>
what I want to do is send the user to a different link when they click on the someURL text link. the user can come to a page containing this html from many other pages.
i have tried many hours but cannot get my js to recognize a click event for a class associated with hyperlinked text. i could really use some help here. this is the js code i wrote which does not work
window.onload = function() {
prepEventHandler();
}
function prepEventHandler () {
var myClass = document.getElementsByClassName("continue-shopping");
myClass[0].onclick=window.open(document.referrer,"_self");
/* which make my pages go haywire OR THIS -- which also does not work */
myClass[0].addEventListener("click", function() {
window.open(document.referrer,"_self");
}
)
}
It just keeps ignoring the second function, and I am sure I am doing some really basic that is wrong. Again, thanks for any help!

Apart from preventDefault() you could also use return false
window.onload = function () {
var myClass = document.querySelector(".continue-shopping")
.onclick = function () {
window.location.href = "http://elsewere.com";
return false;
}
}

this code should work but it no longer does and i do not know why any hint much appreciated - there seems to be some problem with myClass[0]
window.onload = function() {
var myClass = document.getElementsByClassName('continue-shopping');
myClass[0].addEventListener("click", function(e) {
e.preventDefault();
window.location.href = document.referrer;
});
}

slideUp command being ignored, but works in console?

Below is my snippet of code, intended to show the comments of a certain thread that's selected.
$('.comments-count').click(function(){
if(!commentsDown){
$(this).parent().parent().siblings('.comments').stop().slideDown();
commentsDown = true;
currentlyDown = $(this).parent().parent().siblings('.comments');
}else{
$(currentlyDown).stop().slideUp();
var newDown = $(this).parent().parent().siblings('.comments');
if(newDown != currentlyDown){
$(this).parent().parent().siblings('.comments').stop().slideDown();
commentsDown = true;
currentlyDown = $(this).parent().parent().siblings('.comments');
}else{
commentsDown = false;
currentlyDown = null;
}
}
})
The line $(currentlyDown).stop().slideUp(); works if you post it into the console, but for some reason it's ignored in this script. I put in console.log() commands and it showed that it definitely should execute it.
commentsDown and currentlyDown are global variables, initially set to false and null respectively.
Here's a JSFiddle. The threads are currently static HTML. As you can see, if you open a thread and then open a different one it works fine, but it doesn't work to close a thread.

You should be able to reduce your whole block of code to:
$(document).ready(function () {
$('.comments-count').click(function () {
$('.comments-count').not($(this)).parent().parent().siblings('.comments').stop().slideUp();
$(this).parent().parent().siblings('.comments').stop().slideToggle();
})
//Log colour pattern
$('div.event-log-entry:even').addClass('evens');
$('div.event-log-entry:even .comments-count').addClass('evens');
})
jsFiddle example

Add your function inside document.ready tags;
$(document).ready(function () {
//insert your code here
});
For more info. go on this site:
http://learn.jquery.com/using-jquery-core/document-ready/
Hope it helps :)

How to call script jquery when web page is showned?

my process is when user click button print in first form then process is redirect to second page. Now when second page is showed i want to call jquery .How can i do , Please help. because i want to get html from second page.
this is my code in web
<script>
$(function () {
setTimeout(function () { printForm() }, 3500);
function printForm() {
window.onload(function () {
<%testMethod();%>
});
}
});
</script>
this is my code in code behide
public void testMethod() {
if (!Page.IsPostBack)
{
WebClient MyWebClient = new WebClient();
string html = MyWebClient.DownloadString(Session["url"].ToString());
}
}
But the problem is testMethod is calling before scond page is show. i want to do like window.print()

If I understand you correctly, you want to get jquery when other page loads, to do that with js only, you have to do something like this:
your_server ="some_server_name"
(function() {
var jquery_scrpt = document.createElement('script'); jquery_scrpt.type = 'text/javascript'; jquery_scrpt.async = true;
jquery_scrpt.src = 'https://' + your_server + '//code.jquery.com/jquery-1.11.2.min.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(jquery_scrpt);
})();
this will add jquery dynamically to your page.Hope that helps.

How can I combine that javascript and jQuery function to hide a button?

I downloaded the File upload script called Simple Photo Manager.
Since I'm more familiar with jQuery functions I want to use them in combination with the already existing JS code from that script.
I basically want to hide the Delete button when it's clicked.
Why is the Delete button not being hidden after I click on it?
(Note: the JS files are correctly included into the HTML file)
Also, the delLink.removeChild and delLink.appendChild are useless here because it was originally intended for a Delete/Restore switch link, but I decided to go for a button instead.
Thanks a lot if you can help me.
The html code is:
<input type='button' id='deleteit' onClick="deleteLinkOnClick
(this, 'delFlag<?=$imgid?>')">
The JS code for creating that element when an image is uploaded is:
var image_del_link = par.createElement('input');
image_del_link.type = "button";
image_del_link.value = "Delete";
imgdiv.appendChild(image_del_link);
The function for the onclick is: (I tried to write the jQuery function at the bottom)
function deleteLinkOnClick(delLink, delFlag) {
var par = window.document;
var imgDiv = delLink.parentNode;
var image_hidden = delFlag == '' ? imgDiv.childNodes[2] : par.getElementById(delFlag);
if (image_hidden.value == '1') {
image_hidden.value = '0';
delLink.removeChild(delLink.childNodes[0]);
delLink.appendChild(par.createTextNode("Restore"));
delLink.style.color = '#FF0000';
}
else {
image_hidden.value = '1';
delLink.removeChild(delLink.childNodes[0]);
delLink.appendChild(par.createTextNode("Delete"));
delLink.style.color = '#64B004';
}
$(document).ready(function(){
$(image_del_link).click(function(){
$(this).hide();
});
});
}

Here it is.
$("#deleteit").click(function(){
$(this).hide();
})

Try :
$("#deleteit").live("click", function(){
$(this).hide();
});

Can't get a button to execute Javascript code

I wrote some html/css/javascript code that was taken verbatim from a javascript textbook. For some reason, the code does not run correctly in my browser (which is the newest version of Firefox). When I click the button, the javascript function "toggleStyle()" does not execute in the browser at ALL. This is the code for the button:
<button type="button" onclick="toggleStyle()">Toggle Style</button>
This is the javascript coding. Note that when I click the button, not even the alert() method is executed:
function toggleStyle() {
alert("toggleStyle() is working.");
var divMessage = document.getElementById("divMessage");
if (divMessage.className === "message-style1") {
divMessage.className = "";
}
else {
divMessage.className = "message-style1";
}

Did you put the code inside <script type="text/javascript">?
<script type="text/javascript">
function toggleStyle() {
alert("toggleStyle() is working.");
var divMessage = document.getElementById("divMessage");
if (divMessage.className === "message-style1") {
divMessage.className = "";
}
else {
divMessage.className = "message-style1";
}
}
</script>
The above code is working:

For starters, I don't see the end } brace; do you have one?
Also, where is the function defined? Does the script get loaded? Are there any errors?