如何使用jquery或javascript为div添加onload事件？

Question

如何使用jquery或javascript为div添加onload事件？

3

大家好，我正在尝试在 div 的 onload 事件上调用一个函数，但是我找不到任何可以帮助我在 onload 事件上调用函数的东西。我试图使用 "oQuickReply.swap" 来调用它，但这并不起作用，因为那只会交换位置。所以你能告诉我如何为一个 div 添加 onload 事件吗？我的问题不同，因为我有一个只能在循环中调用的函数来获取“post_id”值传递给 select_comment() 函数，我想要的 onload 事件是调用我的函数 select_comment()，它会将所有评论从数据库获取到页面上。让我展示给你我的代码，如果有什么你不理解的，请事先告诉我，我会详细说明。

     <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_comment('+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_comment"></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_comment" cols="25" rows="1"  class="form-control message"  placeholder="Whats on your mind ?"></textarea><button type="submit" id="comment_button" onclick="comment_here('+post_id+');">Comment</button></form></div></div></li></ul></div></div>');                 

                    });
                  }
              }
            });
          }
function select_comment(post_id)
{

  alert(post_id);

  var User_id = $('.id_data').attr('value');
 jQuery.ajax({
                  type:'POST',
                  url:'<?php echo base_url("user/select_comment"); ?>',
                  data: {Post_id:Post_id,User_id:User_id},
                  dataType: 'json', 
                  success:function(data)
                  {
                    alert('you have like this');
                  }
          });

}

现在你看到了，这就是我想要使用我的函数在该 div 加载时调用的方式。

- Himanshu Goyal

1

如果您能够发布一些代码，那就更好了！ - Keerthana Prabhakaran

2

div 元素没有 load 事件。如果您提供更多信息，我们可能可以帮助您实现您的实际目标。 - T.J. Crowder

当('.my-div')加载完成时执行函数() {} - Justinas

可能是[Javascript onload function alternative]的重复问题 (http://stackoverflow.com/questions/42037147/javascript-onload-function-alternative)。 - Aman Kumar

3个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Bhavesh Bhuva · Answer 1

请参考下面的代码。可能会对您有帮助。

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/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>Welcome 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>

- Paul · Answer 2

使用jQuery来实现：

<script
              src="https://code.jquery.com/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 command
</div>

https://jsfiddle.net/g7re6khu/

- Chandan Kumar · Answer 3

-3

你可以在任何元素、窗口或文档上使用ready函数。一旦目标元素被加载，所需的块就会执行。以下是相应的示例。

$("#myid").ready(function(){
    //block will be loaded with element with id myid is ready in dom
})

- Chandan Kumar

虽然这段代码可能解决了问题，但是在回答中加入解释参考，说明它是如何解决问题的，真的有助于提高你的帖子质量，并可能导致更多的赞同。请记住，您正在为未来的读者回答问题，而不仅仅是现在提问的人。请[编辑]您的答案以添加解释并指出适用的限制和假设。From Review - double-beep

实际上并非如此，它只是简单地监听常规文档准备就绪。无论使用什么选择器（或者根本不使用），文档都是这样说明的文档链接。 - Shikkediel