231

Bagaimana cara Anda menambahkan onload acara ke elemen?

Bisakah saya menggunakan:

<div onload="oQuickReply.swap();" ></div>

untuk ini?

javascript html monkey_boys
sumber

terbaik bodylebih baikdiv

KingRider

2

divelemen tidak "memuat".

amn

1

Ada jawaban yang lebih relevan sekarang - mungkin Anda dapat merevisi penerimaan?

mplungjan

233

Tidak bisa. Cara termudah untuk membuatnya berfungsi adalah dengan menempatkan panggilan fungsi langsung setelah elemen

Contoh:

...
<div id="somid">Some content</div>
<script type="text/javascript">
   oQuickReply.swap('somid');
</script>
...

atau - bahkan lebih baik - tepat di depan </body>:

...
<script type="text/javascript">
   oQuickReply.swap('somid');
</script>
</body>

... jadi itu tidak memblokir konten berikut dari memuat.

DanMan
sumber

3

Tergantung pada penggunaannya, tidak baik untuk meletakkannya di depan </body>. fe jika Anda ingin menyembunyikan <div>satu - satunya jika javascript diaktifkan tetapi hindari "flashing". Waktu visibilitas tergantung pada berapa lama browser perlu memuat / mem-parsing semua skrip inline / eksternal.

mgutt

Apakah ini anti-pola, karena lebih baik menyimpan semua js di dalam file sendiri? Apakah ada cara untuk menjalankan selektif ketika elemen-elemen tertentu dimuat ke dalam dokumen?

Ryan Walton

1

Ini bukan anti-pola, tetapi Anda biasanya menunggu DOM untuk dimuat dan kemudian melakukan semua hal JS.

DanMan

1

Buang tautan ini ke sini untuk siapa saja yang menemukan jawaban ini w3schools.com/tags/ev_onload.asp - Semua elemen HTML yang saat ini mendukungonload

Brandon Benefield

Jawaban ini tidak lagi relevan. Ini yang baru

mplungjan

74

The onloadevent hanya dapat digunakan pada document(body)itu sendiri, frame, gambar, dan skrip. Dengan kata lain, itu dapat dilampirkan hanya pada badan dan / atau setiap sumber daya eksternal . Div bukan sumber daya eksternal dan dimuat sebagai bagian dari tubuh, sehingga onloadacara tidak berlaku di sana.

Kijin
sumber

18

Tidak hanya di elemen body, Anda bisa menggunakannya juga dengan image dan iframe misalnya, antara lain. w3schools.com/jsref/event_onload.asp

Joe

2

Perlu dicatat bahwa skrip inline BUKAN sumber daya eksternal, dan karenanya onloadtidak berfungsi pada <script>tanpa srcatribut HTML (saya mencoba menggunakan saran ini dalam skrip inline, dan ternyata tidak berfungsi)

gog

64

Anda dapat memicu beberapa js secara otomatis pada elemen IMG menggunakan onerror, dan tanpa src.

<img src onerror='alert()'>

John Williams
sumber

4

Cemerlang! Dapat digunakan untuk memicu naskah dari sudut juga: img src (error) = "function ()" />

Brian Richardson

1

Ini pendekatan yang fantastis. Silakan lihat perluasan solusi Anda di sini: stackoverflow.com/questions/4057236/…

Rounin

Caniuse? ͏͏͏͏͏͏͏

Pacerier

28

acara onload hanya didukung dengan beberapa tag seperti yang tercantum di bawah ini.

<body>, <frame>, <iframe>, <img>, <input type="image">, <link>, <script>, <style>

Di sini referensi untuk acara onload

Samda
sumber

17

Coba ini! Dan tidak pernah menggunakan trigger dua kali pada div!

Anda dapat menentukan fungsi untuk memanggil sebelum tag div.

$(function(){
    $('div[onload]').trigger('onload');
});

DEMO: jsfiddle

Kuofp
sumber

Di atas jsfiddle tidak memiliki loader jQuery - dan tidak berfungsi.

Arif Burhan

@ Arif Burhan, saya tidak mengerti. Saya memuat JQuery (tepi). Bisakah Anda memeriksanya lagi? Saya dapat melihat "Hello World" bahkan menggunakan ponsel.

Kuofp

@ Kwofp biola itu sebenarnya tidak memiliki penangan dipanggil ketika elemen target mereka dimuat. Itu hanya menggunakan jquery untuk mencari elemen yang memiliki atribut (dalam kasus Anda onload) dan kemudian memanggil fungsi-fungsi tersebut. Skrip berfungsi bahkan jika Anda mengubah atribut ke sesuatu selain onloadmis. Jsfiddle.net/mrszgbxh

Trindaz

1

@ Trindaz Persis! Dengan kata lain, skrip bertindak seperti acara onload. Terima kasih telah meninggalkan komentar!

Kuofp

10

Saya hanya ingin menambahkan di sini bahwa jika ada yang ingin memanggil fungsi saat memuat acara div & Anda tidak ingin menggunakan jQuery (karena konflik seperti dalam kasus saya) maka cukup panggil fungsi setelah semua kode html atau kode lain yang telah Anda tulis termasuk kode fungsi dan cukup panggil fungsi.

/* All Other Code*/
-----
------
/* ----At the end ---- */
<script type="text/javascript">
   function_name();
</script>

ATAU

/* All Other Code*/
-----
------
/* ----At the end ---- */
<script type="text/javascript">
 function my_func(){
   function definition;      

  }

 my_func();
</script>

dev_khan
sumber

Bisakah Anda menambahkan lebih dari satu fungsi dengan cara ini? yaitu di akhir dokumen html tepat sebelum tag </body>? Jika ya, apakah urutan penulisan materi itu?

Neo

Ya, Anda dapat menambahkan lebih dari satu fungsi dan urutannya tidak akan menjadi masalah javascript biasa (vanilla).

dev_khan

7

kita dapat menggunakan MutationObserver untuk menyelesaikan masalah secara efisien dengan menambahkan kode sampel di bawah ini

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        #second{
            position: absolute;
            width: 100px;
            height: 100px;
            background-color: #a1a1a1;
        }
    </style>
</head>
<body>
<div id="first"></div>
<script>
    var callthis = function(element){
           element.setAttribute("tabIndex",0);
        element.focus();
        element.onkeydown = handler;
        function handler(){
                alert("called")
        }
    }


    var observer = new WebKitMutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            for (var i = 0; i < mutation.addedNodes.length; i++)
            if(mutation.addedNodes[i].id === "second"){
                callthis(mutation.addedNodes[i]);
            }

        })
    });
    observer.observe(document.getElementById("first"), { childList: true });


    var ele = document.createElement('div');
    ele.id = "second"

    document.getElementById("first").appendChild(ele);

</script>

</body>
</html>

pengguna2364729
sumber

1

Terakhir kali saya memeriksa peristiwa mutasi yang dilakukan dengan sangat buruk.

DanMan

7

Pada November 2019, saya mencari cara untuk membuat (hipotetis) onparse EventListeneruntuk <elements>yang tidak mengambil onload.

(Hipotetis) onparse EventListenerharus dapat mendengarkan ketika elemen diurai .

Percobaan Ketiga (dan Solusi Definitif)

Saya cukup senang dengan Percobaan Kedua di bawah ini, tetapi saya baru sadar bahwa saya dapat membuat kode lebih pendek dan sederhana, dengan membuat acara yang dibuat khusus:

let parseEvent = new Event('parse');

Ini adalah solusi terbaik.

Contoh di bawah ini:

Membuat yang dibuat khusus parse Event
Menyatakan suatu fungsi (yang dapat dijalankan window.onloadkapan saja) yang:
- Menemukan elemen apa pun dalam dokumen yang menyertakan atribut data-onparse
- Melampirkan parse EventListenerke masing-masing elemen tersebut
- Mengirimkan parse Eventke masing-masing elemen untuk mengeksekusiCallback

Contoh kerja:

// Create (homemade) parse event
let parseEvent = new Event('parse');

// Create Initialising Function which can be run at any time
const initialiseParseableElements = () => {

  // Get all the elements which need to respond to an onparse event
  let elementsWithParseEventListener = document.querySelectorAll('[data-onparse]');
  
  // Attach Event Listeners and Dispatch Events
  elementsWithParseEventListener.forEach((elementWithParseEventListener) => {

    elementWithParseEventListener.addEventListener('parse', updateParseEventTarget, false);
    elementWithParseEventListener.dataset.onparsed = elementWithParseEventListener.dataset.onparse;
    elementWithParseEventListener.removeAttribute('data-onparse');
    elementWithParseEventListener.dispatchEvent(parseEvent);
  });
}

// Callback function for the Parse Event Listener
const updateParseEventTarget = (e) => {
  
  switch (e.target.dataset.onparsed) {

    case ('update-1') : e.target.textContent = 'My First Updated Heading'; break;
    case ('update-2') : e.target.textContent = 'My Second Updated Heading'; break;
    case ('update-3') : e.target.textContent = 'My Third Updated Heading'; break;
    case ('run-oQuickReply.swap()') : e.target.innerHTML = 'This <code>&lt;div&gt;</code> is now loaded and the function <code>oQuickReply.swap()</code> will run...'; break;
  }
}

// Run Initialising Function
initialiseParseableElements();

let dynamicHeading = document.createElement('h3');
dynamicHeading.textContent = 'Heading Text';
dynamicHeading.dataset.onparse = 'update-3';

setTimeout(() => {

  // Add new element to page after time delay
  document.body.appendChild(dynamicHeading);

  // Re-run Initialising Function
  initialiseParseableElements();

}, 3000);

div {
  width: 300px;
  height: 40px;
  padding: 12px;
  border: 1px solid rgb(191, 191, 191);
}

h3 {
position: absolute;
top: 0;
right: 0;
}

<h2 data-onparse="update-1">My Heading</h2>
<h2 data-onparse="update-2">My Heading</h2>
<div data-onparse="run-oQuickReply.swap()">
This div hasn't yet loaded and nothing will happen.
</div>

Luaskan cuplikan

Usaha kedua

The Attempt Pertama bawah (berdasarkan @JohnWilliams'brilian Kosong Gambar Hack ) menggunakan hardcoded<img /> dan bekerja.

Saya pikir itu mungkin untuk menghapus hardcoded <img />sepenuhnya dan hanya secara dinamis memasukkannya setelah mendeteksi, dalam elemen yang perlu memecat suatu onparseperistiwa, atribut seperti:

data-onparse="run-oQuickReply.swap()"

Ternyata, ini bekerja dengan sangat baik.

Contoh di bawah ini:

Menemukan elemen apa pun dalam dokumen yang menyertakan atribut data-onparse
Secara dinamis menghasilkan <img src />dan menambahkannya ke dokumen, segera setelah masing-masing elemen tersebut
Menyalakan onerror EventListenerketika mesin rendering mem-parsing masing-masing<img src />
Menjalankan Callback dan menghapus yang dihasilkan secara dinamis <img src />dari dokumen

Contoh kerja:

// Get all the elements which need to respond to an onparse event
let elementsWithParseEventListener = document.querySelectorAll('[data-onparse]');

// Dynamically create and position an empty <img> after each of those elements 
elementsWithParseEventListener.forEach((elementWithParseEventListener) => {

  let emptyImage = document.createElement('img');
  emptyImage.src = '';
  elementWithParseEventListener.parentNode.insertBefore(emptyImage, elementWithParseEventListener.nextElementSibling);
});

// Get all the empty images
let parseEventTriggers = document.querySelectorAll('img[src=""]');

// Callback function for the EventListener below
const updateParseEventTarget = (e) => {

  let parseEventTarget = e.target.previousElementSibling;
  
  switch (parseEventTarget.dataset.onparse) {

    case ('update-1') : parseEventTarget.textContent = 'My First Updated Heading'; break;
    case ('update-2') : parseEventTarget.textContent = 'My Second Updated Heading'; break;
    case ('run-oQuickReply.swap()') : parseEventTarget.innerHTML = 'This <code>&lt;div&gt;</code> is now loaded and the function <code>oQuickReply.swap()</code> will run...'; break;
  }
  
  // Remove empty image
  e.target.remove();
}

// Add onerror EventListener to all the empty images
parseEventTriggers.forEach((parseEventTrigger) => {
  
  parseEventTrigger.addEventListener('error', updateParseEventTarget, false);
  
});

div {
  width: 300px;
  height: 40px;
  padding: 12px;
  border: 1px solid rgb(191, 191, 191);
}

<h2 data-onparse="update-1">My Heading</h2>
<h2 data-onparse="update-2">My Heading</h2>
<div data-onparse="run-oQuickReply.swap()">
This div hasn't yet loaded and nothing will happen.
</div>

Luaskan cuplikan

Percobaan pertama

Saya dapat membangun @JohnWilliams' <img src>retas (di halaman ini, mulai 2017) - yang sejauh ini merupakan pendekatan terbaik yang pernah saya temui.

Contoh di bawah ini:

Menghidupkan onerror EventListenersaat mesin rendering diurai<img src />
Jalankan Callback dan hapus <img src />dari dokumen

Contoh kerja:

let myHeadingLoadEventTrigger = document.getElementById('my-heading-load-event-trigger');

const updateHeading = (e) => {

  let myHeading = e.target.previousElementSibling;
  
  if (true) { // <= CONDITION HERE
    
    myHeading.textContent = 'My Updated Heading';
  }
  
  // Modern alternative to document.body.removeChild(e.target);
  e.target.remove();
}

myHeadingLoadEventTrigger.addEventListener('error', updateHeading, false);

<h2>My Heading</h2>
<img id="my-heading-load-event-trigger" src />

Luaskan cuplikan

Rounin
sumber

Lihat: stackoverflow.com/questions/58837574/...

Rounin

@ Davidvidrad - Anda tidak akan pernah percaya, tapi saya pikir saya benar - benar telah memecahkannya. Lihat Percobaan Kedua , di bagian atas jawaban di atas.

Rounin

1

@ Davidvidrradshaw - Gosok itu. Saya telah menemukan Upaya Ketiga . Ini adalah solusi pasti.

Rounin

Mungkin memotong jawabannya ke versi 3

David Bradshaw

6

gunakan iframe dan sembunyikan iframe berfungsi seperti tag tubuh

<!DOCTYPE html>
<html>
<body>

<iframe style="display:none" onload="myFunction()" src="http://www.w3schools.com"></iframe>
<p id="demo"></p>

<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Iframe is loaded.";
}
</script>

</body>
</html>

dota2pro
sumber

6

Saya perlu menjalankan beberapa kode inisialisasi setelah sepotong html (contoh templat) dimasukkan, dan tentu saja saya tidak memiliki akses ke kode yang memanipulasi templat dan memodifikasi DOM. Gagasan yang sama berlaku untuk setiap modifikasi parsial DOM dengan memasukkan elemen html, biasanya a<div> .

Beberapa waktu yang lalu, saya melakukan hack dengan event onload yang hampir tidak terlihat yang <img>terkandung dalam a <div>, tetapi menemukan bahwa gaya scoped, kosong juga akan melakukan:

<div .... >
<style scoped="scoped" onload="dosomethingto(this.parentElement);" >   </style>
.....
</div>

Pembaruan (15 Jul 2017) - <style>Onload tidak didukung di versi terakhir IE. Edge memang mendukungnya, tetapi beberapa pengguna melihat ini sebagai browser yang berbeda dan tetap menggunakan IE. The <img>elemen tampaknya bekerja lebih baik di semua browser.

<div...>
<img onLoad="dosomthing(this.parentElement);" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" />
...
</div>

Untuk meminimalkan dampak visual dan penggunaan sumber daya gambar, gunakan src sebaris yang membuatnya kecil dan transparan.

Satu komentar yang saya rasa perlu saya buat tentang menggunakan <script>adalah seberapa sulit untuk menentukan <div>skrip mana yang dekat, terutama dalam templating di mana Anda tidak dapat memiliki id yang identik dalam setiap contoh yang dihasilkan oleh template. Saya pikir jawabannya mungkin document.currentScript, tetapi ini tidak didukung secara universal. Suatu <script>elemen tidak dapat menentukan lokasi DOMnya sendiri secara andal; referensi ke 'ini' menunjuk ke jendela utama, dan tidak membantu.

Saya percaya perlu untuk puas menggunakan <img>elemen, meskipun konyol. Ini mungkin lubang di kerangka DOM / javascript yang bisa menggunakan plugging.

Floyd Kosch
sumber

3

Karena onloadacara hanya didukung pada beberapa elemen, Anda harus menggunakan metode alternatif.

Anda dapat menggunakan MutationObserver untuk ini:

const trackElement = element => {
  let present = false;
  const checkIfPresent = () => {
    if (document.body.contains(element)) {
      if (!present) {
        console.log('in DOM:', element);
      }
      present = true;
    } else if (present) {
      present = false;
      console.log('Not in DOM');
    }
  };

  const observer = new MutationObserver(checkIfPresent);
  observer.observe(document.body, { childList: true });
  checkIfPresent();

  return observer;
};

const element = document.querySelector('#element');
const add = () => document.body.appendChild(element);
const remove = () => element.remove();

trackElement(element);

<button onclick="add()">Add</button>
<button onclick="remove()">Remove</button>

<div id="element">Element</div>

Luaskan cuplikan

jo_va
sumber

2

Saya sangat suka perpustakaan YUI3 untuk hal semacam ini.

<div id="mydiv"> ... </div>

<script>
YUI().use('node-base', function(Y) {
  Y.on("available", someFunction, '#mydiv')
})

Lihat: http://developer.yahoo.com/yui/3/event/#onavailable

mjhm
sumber

9

Itu gumpalan besar JS untuk dibuang ke halaman demi mengikat satu onload.

meagar

1

@meagar - Benar, meskipun saya merasa semakin jarang bahwa saya hanya melakukan dua atau tiga hal JS sederhana pada satu halaman. Khawatir tentang kompatibilitas lintas browser juga membuat saya gila.

mjhm

0

Saya belajar javascript dan jquery dan sedang melalui semua jawaban, saya menghadapi masalah yang sama ketika memanggil fungsi javascript untuk memuat elemen div. Saya mencoba$('<divid>').ready(function(){alert('test'}) dan itu berhasil untuk saya. Saya ingin tahu apakah ini cara yang baik untuk melakukan panggilan onload pada elemen div seperti yang saya lakukan menggunakan pemilih jquery.

Terima kasih

subro
sumber

0

Seperti yang telah dikatakan, Anda tidak bisa menggunakan event onLoad pada DIV sebagai gantinya tetapi sebelum tag body.

tetapi jika Anda memiliki satu file footer dan memasukkannya dalam banyak halaman. lebih baik untuk memeriksa terlebih dahulu jika div yang Anda inginkan ada di halaman yang ditampilkan, sehingga kode tidak dieksekusi di halaman yang tidak mengandung DIV untuk membuatnya memuat lebih cepat dan menghemat waktu untuk aplikasi Anda.

jadi Anda perlu memberikan DIV itu ID dan melakukan:

var myElem = document.getElementById('myElementId');
if (myElem !== null){ put your code here}

Mostafa Yousef
sumber

0

Saya memiliki pertanyaan yang sama dan sedang mencoba untuk mendapatkan Div untuk memuat skrip gulir, menggunakan onload atau memuat. Masalah yang saya temukan adalah bahwa itu akan selalu berfungsi sebelum Div dapat dibuka, tidak selama atau setelah, jadi itu tidak akan berhasil.

Lalu saya datang dengan ini sebagai pekerjaan di sekitar.

<body>

<span onmouseover="window.scrollTo(0, document.body.scrollHeight);" 
onmouseout="window.scrollTo(0, document.body.scrollHeight);">

<div id="">
</div>

<a href="" onclick="window.scrollTo(0, document.body.scrollHeight);">Link to open Div</a>

</span>
</body>

Saya menempatkan Div di dalam Span dan memberikan Span dua peristiwa, mouseover dan mouseout. Kemudian di bawah Div itu, saya menempatkan tautan untuk membuka Div, dan memberikan tautan itu acara untuk onclick. Semua acara sama persis, untuk membuat halaman gulir ke bawah ke bawah halaman. Sekarang ketika tombol untuk membuka Div diklik, halaman akan melompat turun sebagian, dan Div akan terbuka di atas tombol, menyebabkan peristiwa mouseover dan mouseout membantu mendorong skrip gulir ke bawah. Maka setiap gerakan mouse pada saat itu akan mendorong skrip untuk terakhir kalinya.

Selektif
sumber

0

Anda dapat menggunakan interval untuk memeriksanya sampai dimuat seperti ini: https://codepen.io/pager/pen/MBgGGM

let checkonloadDoSomething = setInterval(() => {
  let onloadDoSomething = document.getElementById("onloadDoSomething");
  if (onloadDoSomething) {
    onloadDoSomething.innerHTML="Loaded"
    clearInterval(checkonloadDoSomething);
  } else {`enter code here`
    console.log("Waiting for onloadDoSomething to load");
  }
}, 100);

Robert Page
sumber

0

Pertama untuk menjawab pertanyaan Anda: Tidak, Anda tidak bisa, tidak secara langsung seperti yang Anda inginkan. Mungkin agak terlambat untuk menjawab, tapi ini solusi saya, tanpa jQuery, javascript murni. Ini awalnya ditulis untuk menerapkan fungsi mengubah ukuran ke textareas setelah DOM dimuat dan pada keyup.

Cara yang sama Anda dapat menggunakannya untuk melakukan sesuatu dengan (semua) divs atau hanya satu, jika ditentukan, seperti:

document.addEventListener("DOMContentLoaded", function() {
    var divs = document.querySelectorAll('div'); // all divs
    var mydiv = document.getElementById('myDiv'); // only div#myDiv
    divs.forEach( div => {
        do_something_with_all_divs(div);
    });
    do_something_with_mydiv(mydiv);
});

Jika Anda benar-benar perlu melakukan sesuatu dengan div, dimuat setelah DOM dimuat, misalnya setelah panggilan ajax, Anda bisa menggunakan peretasan yang sangat membantu, yang mudah dimengerti dan Anda akan menemukannya ... bekerja-dengan- elemen-sebelum-the-dom-adalah-siap ... . Ia mengatakan "sebelum DOM siap" tetapi berfungsi dengan cara yang sama, setelah penyisipan ajax atau js-appendChild-apa pun div. Inilah kodenya, dengan beberapa perubahan kecil pada kebutuhan saya.

css

.loaded { // I use only class loaded instead of a nodename
    animation-name: nodeReady;
    animation-duration: 0.001s;
}

@keyframes nodeReady {  
    from { clip: rect(1px, auto, auto, auto); }
    to { clip: rect(0px, auto, auto, auto); }  
}

javascript

document.addEventListener("animationstart", function(event) {
    var e = event || window.event;
    if (e.animationName == "nodeReady") {
        e.target.classList.remove('loaded');
        do_something_else();
    }
}, false);

ddlab
sumber

0

Ketika Anda memuat beberapa html dari server dan memasukkannya ke dalam pohon DOM Anda dapat menggunakannya DOMSubtreeModifiednamun sudah usang - sehingga Anda dapat menggunakan MutationObserveratau hanya mendeteksi konten baru di dalam fungsi loadElement secara langsung sehingga Anda tidak perlu menunggu acara DOM

Tampilkan cuplikan kode

var ignoreFirst=0;
var observer = (new MutationObserver((m, ob)=>
{
  if(ignoreFirst++>0) {
    console.log('Element add on', new Date());
  }
}
)).observe(content, {childList: true, subtree:true });


// simulate element loading
var tmp=1;
function loadElement(name) {  
  setTimeout(()=>{
    console.log(`Element ${name} loaded`)
    content.innerHTML += `<div>My name is ${name}</div>`; 
  },1500*tmp++)
}; 

loadElement('Michael');
loadElement('Madonna');
loadElement('Shakira');

<div id="content"><div>

Luaskan cuplikan

Kamil Kiełczewski
sumber

0

Anda dapat melampirkan pendengar acara seperti di bawah ini. Ini akan memicu setiap kali div memiliki pemilih #my-idmemuat sepenuhnya ke DOM.

$(document).on('EventName', '#my-id', function() {
 // do something
});

Dalam hal ini, EventName mungkin 'memuat' atau 'klik'

https://api.jquery.com/on/#on-events-selector-data-handler

SkyRar
sumber

-1

Gunakan acara body.onload, baik melalui atribut ( <body onload="myFn()"> ...) atau dengan mengikat suatu acara di Javascript. Ini sangat umum dengan jQuery :

$(document).ready(function() {
    doSomething($('#myDiv'));
});

mway
sumber

javascript murni dan bukan jquery, centang tag;)

KingRider

-3

Coba ini.

document.getElementById("div").onload = alert("This is a div.");

<div id="div">Hello World</div>

Coba yang ini juga. Anda harus menghapus .dari oQuickReply.swap()agar fungsi berfungsi.

document.getElementById("div").onload = oQuickReplyswap();
function oQuickReplyswap() {
alert("Hello World");
}

<div id="div"></div>

sumber

Tampaknya berfungsi, tetapi itu hanya, yang alert("This is a div.");dipanggil ketika baris ini dieksekusi dan hasilnya (yang undefined) ditugaskan untuk div.onload. Yang sama sekali tidak ada gunanya.

Frederic Leitenberger

-4

Anda tidak bisa menambahkan event onload di div, tetapi Anda bisa menambahkan onkeydown dan memicu event onkeydown pada pemuatan dokumen

$(function ()
{
  $(".ccsdvCotentPS").trigger("onkeydown");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<div  onkeydown="setCss( );"> </div>`

Muhammad Bilal
sumber

Bagaimana cara menambahkan event onload ke elemen div

Jawaban:

Percobaan Ketiga (dan Solusi Definitif)

Usaha kedua

Percobaan pertama