We Keep Coding

Click on button with jQuery doesn't have action [duplicate]

This question already has answers here:
Event binding on dynamically created elements?
(23 answers)
Closed 3 years ago.
I'm stuck with an button, and can't understand why it isn't work.
$('#full-london').on('click', () => {
weatherPage.render('London');
});
'#full-london' is id of my button
weatherPage.render starts some jQuery code witch change my front page. This is tested in other case and it work correct.
This is the button:
<a id="full-london" class="btn btn-dark">Full forecast</a>
Any idea what is wrong?
Here is additional situation with search button who uses weatherPage.render and it work:
$('#search-city-button').on('click', () => {
const searchString = $('#search-city-input').val();
weatherPage.render(searchString);
});
searchString is search input
<div id="search">
<input type="text" id="search-city-input">
<a id="search-city-button" class="btn btn-danger">Search</a>
</div>
Here is what is weatherPage.render(); do https://pastebin.com/PLgrrYQ0

that makes perfect sense!!
you're adding your button dynamically, so when JS is parsing $('#full-london').on('click',... at that time there's no button on the page, so it can't attach the event to it.
function setEvents() {
$('#full-london').on('click', () => {
weatherPage.render('London');
});
}
make a function inside of your JS module (like setEvents) and call that function AFTER you add button to the page.

Uncaught ReferenceError: printProducts is not defined [duplicate]

This question already has an answer here:
jsFiddle: no connection between html and js? Can't call simple function from button? [duplicate]
(1 answer)
Closed 6 years ago.
I keep getting this error when i inspected the element of my button. The button is suppose to give a print view to page.
HTML Code:
<button class = "hidden-print" onclick = "printProducts()">Print Products</button>
Javascript Code:
function printProducts(){
window.print();
}
Attached here is my code live in jsFiddle:
https://jsfiddle.net/PochMendoza/scj0q0dk/

"In JSFiddle, when you set the wrapping to "onLoad" or "onDomready", the functions you define are only defined inside that block, and cannot be accessed by outside event handlers."
Easiest fix is to change:
function something(...)
To:
window.something = function(...)
---Niet The Dark Absol
For your example, you want to define the onclick method of a button. That's really easy with JavaScript, we just need to give the button an id in the HTML, so that we can find it in our JavaScript code.
Change this:
<button class = "hidden-print" onclick = "printProducts()">Print Products</button>
To this:
<button id="myButton" class="hidden-print">Print Products</button>
Note that we no longer need the onclick="printProducts()" part anymore.
Now we need to set the printProducts function to run when the button is clicked. This can be done like so:
document.getElementById('myButton').onclick = printProducts;
Start edit
This code needs to be placed in the onload function though, to properly run.
Do that like so:
window.onload = function() {
document.getElementById('myButton').onclick = printProducts;
}
End edit
And the printProducts function remains the same.
Working JSFiddle
document.getElementById('myButton').onclick = printProducts;
function printProducts(){
window.print();
}
<button id="myButton" class="hidden-print">Print Products</button>

trying to target a button created by JQuery [duplicate]

This question already has answers here:
Direct vs. Delegated - jQuery .on()
(6 answers)
Closed 7 years ago.
I'm trying to target a button I've created by pressing another button. My code technically works, but due to the size of what I'm doing, I'm trying to put the function of the second button press in another js file. That where I'm running into problems. My code is below.
$("#webCoding").on("click", function() {
if ( $( ".webCodingID" ).length ) {
return false;
}
picture.attr("src", "img/webCoding.jpeg");
$(".target").empty();
$(".jumbotron").hide();
var buttonGroup = $('<div role="group" aria-label="...">').addClass('btn-group-vertical center-block')
var buttonPhilosophy =$("<button type='button'>").addClass("btn btn-default btn-lg").append("Design Philosophy")
var buttonStack =$("<button type='button'>").addClass("btn btn-default btn-lg").append("Visit My Stack Overflow Account")
var buttonGithub =$("<button type='button' id='git'>").addClass("btn btn-default btn-lg").append("Look at what I've been doing on Github")
var webCodingID =$("<div>").addClass("trainingID")
$(buttonGroup).append(buttonPhilosophy).append(buttonGithub).append(buttonStack);
$('.target').append(buttonGroup).append(webCodingID);
// code for pressing created button is below.
$("#git").on("click", function() {
prompt("herro");
});
});
but I put this in another file (and get rid of the same code in the original js file), and nothing happens.
$(document).ready(function(){
$("#git").on("click", function(){
prompt("jungle boogie");
});
I can't figure out why. The js file is linked to my main page, I just can't get it to recognize buttons created by JS in another file.

You should bind the on to the body like so:
$("body").on("click", "#git", function(){
That should solve your problem I believe :)

How to capture click on iframe using javascript [duplicate]

This question already has answers here:
How to add click event to a iframe with JQuery
(13 answers)
Closed 8 years ago.
How to capture click on iframe using javascript.
I'm using this code:
document.getElementsByClassName('pin').contentWindow.document.body.onclick =
function() {
alert("iframe clicked");
}
But it is not able to capture any click of the iframe. I can only use javascript.
I'm getting this error
"SecurityError: Blocked a frame with origin"

var i = 0;
//i represents the exact node since obtaining node by class name gives array of nodes.
var iframe = document.getElementsByClassName('pin')[i].contentWindow;
or
var iframe = document.getElementById("iframe_id").contentWindow;
iframe.document.body.onmousedown =
function() {
alert("iframe clicked");
}

Another way to call function javascript [duplicate]

This question already has answers here:
Javascript in a wordpress page
(2 answers)
Closed 8 years ago.
When I call this code, it does not work.
<script language="javascript">
var l1OK_WC = false;
var l2OK_WC = false;
function share()
{
alert('yo');
}
function getIt_wc()
{
if(l1OK_WC && 120k_WC)
window.open('http://google.ca','_self');
if(!l1OK_WC)
alert("Message 1");
else if(!l2OK_WC)
alert("Message 2");
}
</script>
And this in the html.
<a class="Style3" href="javascript:getIt_wc();"><img src="http://i.imgur.com/XJy0nEq.png" /></a>
When I click the button, no message appears. This script works fine in blogger or html sites, but not on wordpress. I am doing this on a wordpress page.
Thank you.

EDIT: After looking at the source code of the page, you are naming the function incorrectly!
Your function shows on the page as:
function get()
{
if(l1OK_WC && l2OK_WC)
window.open('http://google.ca','_self');</p>
<p> if(!l1OK_WC)
alert("message 1 (You can enter any message)");
else if(!l2OK_WC)
alert("message 2(You can enter any message)");
}
You'll notice two errors:
It's named get() not getIt_wc(), so you're calling the wrong function in your onclick
You have some HTML code in there as well: && and <p> and </p>
ORIGINAL POST:
You don't need the a tag at all. Just use onclick on the image and remove the a tag:
<img class="Style3" src="http://i.imgur.com/XJy0nEq.png" onclick="getIt_wc()" />
To let people know it's clickable, in your stylesheet, add the cursor style to Style3:
.Style3 {
cursor: pointer;
}

Cant work. If you call the method getIt_wc, the variable l1OK_WC is ever call false.
You script are confusing and can't never produce a result.