kết quả từ 1 tới 2 trên 2

Tự động gọi Function trong javascript thay cho Click chuột

  1. #1
    Ðến Từ
    Khánh Hòa
    Thành Viên Thứ: 402706
    Giới tính: Nam
    Bài gửi
    6

    Tự động gọi Function trong javascript thay cho Click chuột

    Mong các anh em trên diễn đàn VFORUM giúp đỡ
    tôi có HTML, có javascript, khi click chuột thì javascript được thực hiện
    thay vào đó tôi muốn không click chuột mà lệnh tự động được thực hiện.
    Kiểu như:
    Mã:
     <script type="text/javascript">
         setTimeout( click, 0);
          setTimeout( click, 10000);
    </script>
    mong được giúp đỡ, xin cảm ơn!

    HTML Code:
    <html lang="en">
    <head>  
    <meta charset="UTF-8">      
    <style>      *, *:before, *:after {  box-sizing: border-box;}
    html, body {  height: 100%;  overflow: hidden;  background: #000;}
    .split {    width: 750px;  height: 468px;  position: absolute;  top: 0%;  left: 0%;  -webkit-transform: translate(-0%, -0%);          transform: translate(-0%, -0%);  -webkit-perspective: 400px;          perspective: 400px;  cursor: pointer;}.split:before {  content: '';  color: #777;  letter-spacing: 1px;  font-size: 10px;  position: absolute;  bottom: -30px;  left: 50%;  -webkit-transform: translate(-50%);          transform: translate(-50%);}.split img {  height: auto;  width: 100%;  opacity: 0;}.split div {  position: absolute;  z-index: 1;  background-repeat: no-repeat;  -webkit-transform: rotateY(-50deg) scale(0.5);          transform: rotateY(-50deg) scale(0.5);  opacity: 0;  -webkit-transform-origin: bottom;          transform-origin: bottom;  -webkit-transition: all 0.6s cubic-bezier(0.71, 0.05, 0.09, 0.91);  transition: all 0.6s cubic-bezier(0.71, 0.05, 0.09, 0.91);}.split.active div {  opacity: 1;  -webkit-transform: rotate(0deg) translateY(0);          transform: rotate(0deg) translateY(0);}
    </style>
    <body>
    <div class="split active">  
    <img src="https://github.com/supahfunk/supah-codepen/blob/master/stcz-1.png?raw=true" />
    </div>  
    <script src='https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.5/dat.gui.min.js'></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
    
    
    <script type="text/javascript">        
    var Split = function() {  
    this.$t = $(".split");  
    this.gridX = 20;  
    this.gridY = 20;  
    this.w = this.$t.width();  
    this.h = this.$t.height();  
    this.img = $("img", this.$t).attr("src");  
    this.delay = 0.05;
      
              this.create = function() {    
              $("div", this.$t).remove();
              for (x = 0; x < this.gridX; x++) {      
              for (y = 0; y < this.gridY; y++) {        
              var width = this.w / this.gridX * 101 / this.w + "%",            
              height = this.h / this.gridY * 101 / this.h + "%",            
              top = this.h / this.gridY * y * 100 / this.h + "%",            
              left = this.w / this.gridX * x * 100 / this.w + "%",            
              bgPosX = -(this.w / this.gridX * x) + "px",            
              bgPosY = -(this.h / this.gridY * y) + "px";
            
              $("<div />")          
              .css({          
              top: top,          
              left: left,          
              width: width,          
              height: height,          
              backgroundImage: "url(" + this.img + ")",          
              backgroundPosition: bgPosX + " " + bgPosY,          
              backgroundSize: this.w + "px",          
              transitionDelay: x * this.delay + y * this.delay + "s"        
              })          
    
              .appendTo(this.$t);      
              }    
              }  
              };
              this.create();
    
              this.$t            
              .on("click", function() {            
              $(this).toggleClass("active");          })            
              .click();        
              };   
            
              window.onload = function() {          
              var split = new Split();          
              var gui = (function datgui() {            
              var gui = new dat.GUI();            
              gui.add(split, "gridX", 1, 20).step(1).onChange(function(newValue) {              
              split.create();            
              });            
              gui.add(split, "gridY", 1, 20).step(1).onChange(function(newValue) {              
              split.create();            
              });            
              gui.add(split, "delay", 0, 0.3).step(0.01).onChange(function(newValue) {              
             split.create();            
            });            
            return gui;          
          })();        
       };    
    </script>
    </body>
    </html>
    Quick reply to this message Trả lời       

  2. #2
    Ðến Từ
    TP. Hồ Chí Minh
    Thành Viên Thứ: 402686
    Giới tính: Nam
    Bài gửi
    74

    Reply: Tự động gọi Function trong javascript thay cho Click chuột

    Bạn làm kiểu này
    Sau khi toàn bộ trang đã được tải xong.
    $(document).ready(function(){
    //Tự động click
    document.getElementById('tên_id_muốn_click_vào ').click();
    });