Skip to content
Advertisement

The buttons not working when I use load() function in jquery

When I use the load() method,the buttons in the file that loaded don’t work;

Code in main page;

$("html").load("demo.php")

Code in demo.php;

<button id="btn">Alert</button>
<script>
var btn = document.getElementById("btn");

btn.onclick = function(){
alert("Hello")
}
</script>

The button works fine when i only open the demo.php but doesn’t work when i load it into another document. Any solutions?


When I replaced the html selector with the body selector it worked

$("body").load("demo.php")


I found out something but still doesn’t explain the reason. When I use the Javascript inline then it will work in the main page like this;

<button onclick="alert('hello')" id="btn">Alert</button>

Advertisement

Answer

Please try other element insted of html

$("another selector").load("demo.php")

Add another elemnt in to your first page and use that elemt to load demo.php

When you are loading the demo.php you are removing the jquery from your page thats why you are getting nothing

Try to create another elemnt as i mentioned above

$(“div”).load(“demo.php”)
User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement