hi guys i am trying to call a function on the onload event of a div but i can't find anything that would help me call a function on the onload event. i did try to call it using this "oQuickReply.swap" but it didn't work as that would only swap the position. so can you tell me how can i add a onload event on a div? my question is different as i have a function that can only be called in a loop to take the 'post_id' value to the function the onload event i want is to call my function select_ment() which would get me all the ments from my database to the page. let me show you my code and if there is something you dont understand tell me beforehand i will detail it.
<script type="text/javascript">
$(window).load(function(e){
// grab the scroll amount and the window height
loadmore();
select_likes();
select_share();
// get_recieve_friend_requests();
// get_sent_friend_requests();
});
function loadmore(){
var lastID = $('.load-more').attr('lastID');
// alert(lastID);
jQuery.ajax({
type:'POST',
url:'<?php echo base_url("user/get_all_post"); ?>',
data: {id: lastID },
dataType: 'json',
beforeSend:function(data){
$('.load-more').show();
},
success:function(data){
var ParsedObject = JSON.stringify(data);
var json = $.parseJSON(ParsedObject);
if (json=="") {
$("#bottom").append('<div class="btn btn-default col-md-6" >'+'No More Results'+'</div>');
$("#Load_more_data").hide()
}else{
$postID=json[json.length-1].id;
$('.load-more').attr('lastID', $postID);
$.each(json, function (key, data) {
var post_id=data.id;
var post_status=data.status;
var status_image=data.status_image;
var multimage=data.multimage;
if(!post_status=="" && !status_image==""){
$("#status_data").append('<div class="panel-footer" onload="select_ment('+post_id+');"><div class="row"><div class="col-md-12"><a href="#">13 people</a> like this</div></div><ul class="media-list"><li class="media_ment"></li><li class="media"><div class="media-left media-top"><?php echo img($user_file_image); ?></div><div class="media-body"><div class="input-group"><form action="" id="form_content"><textarea name="textdata" id="content_ment" cols="25" rows="1" class="form-control message" placeholder="Whats on your mind ?"></textarea><button type="submit" id="ment_button" onclick="ment_here('+post_id+');">Comment</button></form></div></div></li></ul></div></div>');
});
}
}
});
}
function select_ment(post_id)
{
alert(post_id);
var User_id = $('.id_data').attr('value');
jQuery.ajax({
type:'POST',
url:'<?php echo base_url("user/select_ment"); ?>',
data: {Post_id:Post_id,User_id:User_id},
dataType: 'json',
success:function(data)
{
alert('you have like this');
}
});
}
now you see that's how i want to use my function to call when that div loads.
hi guys i am trying to call a function on the onload event of a div but i can't find anything that would help me call a function on the onload event. i did try to call it using this "oQuickReply.swap" but it didn't work as that would only swap the position. so can you tell me how can i add a onload event on a div? my question is different as i have a function that can only be called in a loop to take the 'post_id' value to the function the onload event i want is to call my function select_ment() which would get me all the ments from my database to the page. let me show you my code and if there is something you dont understand tell me beforehand i will detail it.
<script type="text/javascript">
$(window).load(function(e){
// grab the scroll amount and the window height
loadmore();
select_likes();
select_share();
// get_recieve_friend_requests();
// get_sent_friend_requests();
});
function loadmore(){
var lastID = $('.load-more').attr('lastID');
// alert(lastID);
jQuery.ajax({
type:'POST',
url:'<?php echo base_url("user/get_all_post"); ?>',
data: {id: lastID },
dataType: 'json',
beforeSend:function(data){
$('.load-more').show();
},
success:function(data){
var ParsedObject = JSON.stringify(data);
var json = $.parseJSON(ParsedObject);
if (json=="") {
$("#bottom").append('<div class="btn btn-default col-md-6" >'+'No More Results'+'</div>');
$("#Load_more_data").hide()
}else{
$postID=json[json.length-1].id;
$('.load-more').attr('lastID', $postID);
$.each(json, function (key, data) {
var post_id=data.id;
var post_status=data.status;
var status_image=data.status_image;
var multimage=data.multimage;
if(!post_status=="" && !status_image==""){
$("#status_data").append('<div class="panel-footer" onload="select_ment('+post_id+');"><div class="row"><div class="col-md-12"><a href="#">13 people</a> like this</div></div><ul class="media-list"><li class="media_ment"></li><li class="media"><div class="media-left media-top"><?php echo img($user_file_image); ?></div><div class="media-body"><div class="input-group"><form action="" id="form_content"><textarea name="textdata" id="content_ment" cols="25" rows="1" class="form-control message" placeholder="Whats on your mind ?"></textarea><button type="submit" id="ment_button" onclick="ment_here('+post_id+');">Comment</button></form></div></div></li></ul></div></div>');
});
}
}
});
}
function select_ment(post_id)
{
alert(post_id);
var User_id = $('.id_data').attr('value');
jQuery.ajax({
type:'POST',
url:'<?php echo base_url("user/select_ment"); ?>',
data: {Post_id:Post_id,User_id:User_id},
dataType: 'json',
success:function(data)
{
alert('you have like this');
}
});
}
now you see that's how i want to use my function to call when that div loads.
div elements have no load event. If you give us more information, we can probably help you do what your actual end goal is, though.
– T.J. Crowder
Commented
Mar 7, 2017 at 12:33
$('.my-div').load(function () {}) ???
– Justinas
Commented
Mar 7, 2017 at 12:34
Please Refer Below Code. may Be help you
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery./jquery-1.12.4.min.js"></script>
<style>
#divstyle {
text-align: center;
background-color: cadetblue;
width: 550px;
height: 180px;
margin-left: 100px;
}
</style>
</head>
<body onload="myFunction()">
<div id="divstyle">
<h2>Wele to the tutorial for onload event!</h2>
<hr />
<h3>The function will be executed once the page is fully loaded.</h3>
</div>
<script>
function myFunction() {
alert("Hello, User!");
}
</script>
</body>
</html>
use jQuery to this:
<script
src="https://code.jquery./jquery-3.1.1.min.js"
integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
crossorigin="anonymous"></script>
<script>
$('.when-element-with-this-class').ready(function() {
alert( "ready!" );
});
</script>
<div class="when-element-with-this-class">
when this div is ready, js procced function with alert mand
</div>
https://jsfiddle/g7re6khu/
you can use ready function on any element, window or document. Once the targeted element is loaded the required block is executed. Below is example for same.
$("#myid").ready(function(){
//block will be loaded with element with id myid is ready in dom
})