$("#showloader").replaceWith("<span class='iconexclaim'><img src='images/backupiconexclaim.jpg' /></span><span class='retry-btn' onclick='abc()'>Retry</span>");
function abc() {
alert("abc");
}
The above code is replacing the html with selected element object, but when I click on retry it is showing function is not defined.
Satpal
134k13 gold badges168 silver badges171 bronze badges
asked May 18, 2015 at 5:53
Sunil Madan
4571 gold badge5 silver badges19 bronze badges
-
Where did you you defined your method?Satpal– Satpal2015年05月18日 06:00:44 +00:00Commented May 18, 2015 at 6:00
-
your code works good for me, can you elaborate your errorAfsar– Afsar2015年05月18日 06:06:02 +00:00Commented May 18, 2015 at 6:06
-
@zan It is showing function is not definedSunil Madan– Sunil Madan2015年05月18日 06:07:37 +00:00Commented May 18, 2015 at 6:07
4 Answers 4
you need to bind the click on the span to the document, this code will help you on that.
$("#showloader").replaceWith("<span class='iconexclaim'><img src='images/backupiconexclaim.jpg' /></span><span class='retry-btn' >Retry</span>");
$(document)
.on(
'click',
'.retry-btn',
function() {
alert("I am here") ;
}) ;
answered May 18, 2015 at 6:04
Alaa Abuzaghleh
1,0096 silver badges11 bronze badges
Sign up to request clarification or add additional context in comments.
Comments
If you wrap the abc() inside your head tag or on body load, it will work:
function abc() {
alert("hi");
$("#showloader").replaceWith("<span class='iconexclaim'><img src='images/backupiconexclaim.jpg' /></span><span class='retry-btn' onclick='abc()'>Retry</span>");
}
$(document).ready(function(){
abc();
});
answered May 18, 2015 at 6:05
Brijesh Bhatt
3,8303 gold badges21 silver badges34 bronze badges
1 Comment
Brijesh Bhatt
Please comment the reason for downvote, whoever it is. It is recommended also.
You need to put that function code block somewhere (above it) before you call .replaceWith or manipulate the dom.
answered May 18, 2015 at 5:59
NiCk Newman
1,7967 gold badges25 silver badges50 bronze badges
3 Comments
Sunil Madan
this is like demo what i actually calling is the funciton iteself in which I'm manipulating the DOM. function sam() {alert("abc");$("#showloader").replaceWith("<span class='iconexclaim'><img src='images/backupiconexclaim.jpg' /></span><span class='retry-btn' onclick='sam()'>Retry</span>");}
NiCk Newman
If that function is already inputted to the JS parser, you can do
innerHTML or manipulate the dom until the world ends and the function will work. See Brijesh's post, essentially what I just already said. Call the function BEFORE replacement or dom manipulation :)Sunil Madan
I want to call the function in which I'm manipulating the DOM. What I Said already. function sam() { alert("abc"); $("#showloader").replaceWith("<span class='iconexclaim'><img src='images/backupiconexclaim.jpg' /></span><span class='retry-btn' onclick='sam()'>Retry</span>"); }
Please Try like this :
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"> </script>
<script>
$(document).ready(function() {
$("#showloader").replaceWith("<span class='iconexclaim'> <img src='images/backupiconexclaim.jpg' /></span><span class='retry-btn' onClick='abc()'>Retry</span>");
});
function abc(){
alert("abc");
}
</script>
</head>
<body>
<div id='showloader'>helloo world</div>
</body>
</html>
answered May 18, 2015 at 6:12
Antima Gupta
3811 silver badge8 bronze badges
1 Comment
Antima Gupta
Why my point has down please give me the well explanation behind this ?
default