পৃষ্ঠা লোডে আমি কীভাবে একটি জাভাস্ক্রিপ্ট ফাংশন বলব?

244

Ditionতিহ্যগতভাবে, একবার পৃষ্ঠাটি লোড হয়ে যাওয়ার পরে একটি জাভাস্ক্রিপ্ট ফাংশন কল করার জন্য, আপনি onloadকিছুটা জাভাস্ক্রিপ্ট যুক্ত শরীরে একটি বৈশিষ্ট্য যুক্ত করবেন (সাধারণত কেবলমাত্র কোনও ফাংশন কল করে)

<body onload="foo()">

পৃষ্ঠাটি লোড হয়ে গেলে, আমি সার্ভারের ডেটা দিয়ে পৃষ্ঠার অংশগুলি গতিশীলভাবে পপুলেশন করতে কিছু জাভাস্ক্রিপ্ট কোড চালাতে চাই। আমি onloadজেএসপি টুকরো ব্যবহার করছি যেহেতু আমি সেই বৈশিষ্ট্যটি ব্যবহার করতে পারছি না , যার কোনও bodyউপাদান নেই যার সাথে আমি কোনও বৈশিষ্ট্য যুক্ত করতে পারি।

লোডে জাভাস্ক্রিপ্ট ফাংশন কল করার অন্য কোনও উপায় আছে কি? আমি বরং jQuery ব্যবহার করব না কারণ আমি এর সাথে খুব বেশি পরিচিত না।

javascript onload

— palAlaa
সূত্র

15

বিটিডব্লিউ: এটি জাভাস্ক্রিপ্ট; জাভা একটি ভাষা এবং জাভাস্ক্রিপ্ট অন্য। জাভা স্ক্রিপ্টের মতো জিনিস নেই। এফওয়াইআই

— ইয়ানিক রোচন

আপনি যাচাই করতে পারেন যে আপনার প্রশ্নে কেভিনের সম্পাদনা এখনও একই প্রশ্ন জিজ্ঞাসা করছে, বা আমরা বুঝতে পেরেছি তা নিশ্চিত করার জন্য এটি পুনরায় লিখে দিতে পারেন? (আপনি কি অনলোডের বিকল্পের সন্ধান করার চেষ্টা করছেন?)

— STW

388

আপনি যদি ওলোডলোড পদ্ধতিটি প্যারামিটারগুলি নিতে চান তবে আপনি এর মতো কিছু করতে পারেন:

window.onload = function() {
  yourFunction(param1, param2);
};

এটি অন্লোড একটি বেনামে ফাংশনকে আবদ্ধ করে, যা যখন আপনাকে আহ্বান করা হয়, আপনি যা কিছু প্যারামিটার দিয়ে তা আপনার পছন্দসই ফাংশনটি চালাবেন। এবং, অবশ্যই, আপনি বেনামি ফাংশনটির ভিতরে থেকে একাধিক ফাংশন পরিচালনা করতে পারেন।

— ম্যাট সিকার
সূত্র

এবং এখন যখন আমি গতিশীলভাবে একটি সার্ভার-উত্পাদিত পৃষ্ঠা অন্তর্ভুক্ত করছি এবং DOM- প্রস্তুতি প্রয়োজন তখন আমার এই খনি ক্ষেত্রের মাধ্যমে কাজ করা দরকার। যদি কেবল আগে কেউ লাইব্রেরি ব্যবহারকারীদের যথাযথভাবে উত্সাহিত করত।

— স্টেফান কেন্ডাল 21

4

আমি বলিনি এটি একটি ভাল ধারণা ছিল। যদিও আমি যেখানে কাজ করি সেক্ষেত্রে লিড ডেভ ইনটেন্ডেন্ট হিয়ার সিনড্রোমের একটি শক্তিশালী কেস রয়েছে এবং কয়েকটি পৃষ্ঠার বাইরে আমি তাকে জ্যাকোয়ারি ব্যবহার করতে রাজি করতে পারিনি।

— ম্যাট সিকার 21

2

তাহলে সম্ভবত আপনার কাজ স্যুইচ করা উচিত। যদি কাজের জন্য সঠিক সরঞ্জামটি আপনি যে সরঞ্জামটি ব্যবহার করছেন তা না হলে কেন অবিচ্ছিন্নভাবে লড়াই করে অবিচ্ছিন্নভাবে প্রাচীরের বিরুদ্ধে মাথা ঘুরান?

— স্টিফান কেন্ডাল

এবং আমি কী একই বার দ্বিতীয় বার কল করতে পারি বোতামে অন্লিক ইভেন্টটি ব্যবহার করে?

— ফয়জান

73

এটি করার আরেকটি উপায় হ'ল ইভেন্ট শ্রোতাদের ব্যবহার করে আপনি এখানে কীভাবে এটি ব্যবহার করেন:

document.addEventListener("DOMContentLoaded", function() {
  you_function(...);
});

ব্যাখ্যা:

ডোমকন্টেন্টলয়েড এর অর্থ হ'ল ডকুমেন্টের DOM অবজেক্টগুলি জাভাস্ক্রিপ্ট দ্বারা পুরোপুরি লোড করা এবং দেখা গেলেও এটি "ক্লিক", "ফোকাস" হতে পারে ...

ফাংশন () বেনামে ফাংশন, যখন ইভেন্টটি ঘটে তখন তাকে ডাকা হবে।

— আহমেদ জোলানি
সূত্র

5

মনে রাখবেন যে এটি IE 8 এবং এর চেয়ে কম ক্ষেত্রে কাজ করবে না। অন্যথায় এটি সেরা খাঁটি জেএস সমাধান!

— ফিলিপ

46

আপনার মূল প্রশ্নটি অস্পষ্ট ছিল, ধরে নিয়ে কেভিনের সম্পাদনা / ব্যাখ্যাটি সঠিক তবে এই প্রথম বিকল্পটি প্রযোজ্য নয়

সাধারণ বিকল্পগুলি onloadইভেন্টটি ব্যবহার করছে :

<body onload="javascript:SomeFunction()">
....

আপনি নিজের জাভাস্ক্রিপ্টটি শরীরের একেবারে শেষে রাখতে পারেন; ডক সম্পূর্ণ না হওয়া পর্যন্ত এটি কার্যকর করা শুরু করবে না।

<body>
  ...
  <script type="text/javascript">
    SomeFunction();
  </script>
</body>

এবং, অন্য বিকল্পগুলি হল, জেএস ফ্রেমওয়ার্ক ব্যবহার করা বিবেচনা করা যা অন্তর্নিহিতভাবে এটি করে:

// jQuery
$(document).ready( function () {
  SomeFunction();
});

— অগভীর নলকুপ
সূত্র

javascript:মধ্যে onloadঅপ্রয়োজনীয়, ক্ষতিকর না যদিও।

— অিক্টোফয়ে

@ এসটিডাব্লু <script type="text/javascript">LoadResult();</script>দেয়Uncaught ReferenceError: LoadResult is not defined

— গুনাসেগার

37

function yourfunction() { /* do stuff on page load */ }

window.onload = yourfunction;

অথবা আপনি চাইলে jQuery সহ:

$(function(){
   yourfunction();
});

আপনি যদি পৃষ্ঠা লোডে একাধিক ফাংশন কল করতে চান তবে আরও তথ্যের জন্য এই নিবন্ধটি একবার দেখুন:

একাধিক জাভাস্ক্রিপ্ট অন্লোড ফাংশন ব্যবহার করা

— সরফরাজ
সূত্র

3

এটি সঠিক নয়, ফাংশনটি কার্যকর করে এবং যা যা লোডে ফিরে আসে তা নির্ধারণ করে। () সেখানে থাকা উচিত নয়।

— এপাসকারেলো

1

যদি অন্য কোনও ক্রিয়াকলাপ রয়েছে যা অনলোড লোড ইভেন্টের জন্য শুনছে তবে এটি তাদেরকে দূরে সরিয়ে দেবে। কোনও ইভেন্ট হ্যান্ডলার সরাসরি অর্পণ করার চেয়ে ইভেন্ট শ্রোতা যুক্ত করা ভাল। এমনকি এই ক্ষেত্রে আপনি এটি ফাংশন বন্ধ না করে `উইন্ডো.অনলোড = আপনার ফাংশন 'হিসাবে অর্পণ করবেন, আপনার এটির মতো নয়। আপনার উপায় অ্যাসাইনমেন্টের সময় আপনার ফাংশন () কার্যকর করতে চায়।

— রোবস্তো

এটি উইন্ডো.অনলোডকে ফাংশনের রিটার্ন মান নির্ধারণ করবে, যা কাজ করবে না, যদি না ফেরতের মান একটি ফাংশন হয়।

— I.devries

@ পেসকারেলো: ভাল ক্যাচ, ফিক্সড, ফাংশনের নাম লেখার সময় আপনি একটি অভ্যাস দেখেন। ধন্যবাদ

— সরফরাজ

1

উইন্ডো.অনলোড = আপনার কাজ; এইভাবে সমস্যাটি হ'ল এটি ফুকশন প্যারামিটারটি গ্রহণ করে না !!

— পালআলা

8

<!DOCTYPE html>
<html>
    <head>
        <title>Test</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript">
        function codeAddress() {
            alert('ok');
        }
        window.onload = codeAddress;
        </script>
    </head>
    <body>
    
    </body>
</html>

স্নিপেট প্রসারিত করুন

— নামবিহীন
সূত্র

3

আমি মনে করি তার উত্তরটি পরিষ্কার, আপনি দেখতে পাচ্ছেন যে স্ক্রিপ্টটি শিরোনামের মধ্যে রেখে দেওয়া হয়েছে যাতে এটি শরীরের কন্টেন্টের আগে সম্পাদন করা যায় .. বা এর কার্যকারিতা বা যাই হোক না কেন আগে লোড করা যাক .. কখনও কখনও কোনও ব্যক্তি প্রশ্ন জিজ্ঞাসা করে কারণ সে ডোন ' এটি মোটেও জানেন না, তবে এমন পরিস্থিতি কখনও ঘটেনি যেখানে কেউ আপনাকে চামচ খাওয়াত, বা এই সম্প্রদায়ের কেউই চাইবে না, আপনাকে নিজেকে কিছুটা বেশি জিনিস সন্ধান করতে হবে। #

— বিশেষত_আপনি_আপনি_আ_উভে_ডিভুল্পার

8

আপনাকে যে ফাংশনটিতে ফোন করতে হবে তার কল করতে হবে লোডের উপর (অর্থাত্ ডকুমেন্ট / পৃষ্ঠার বোঝা)। উদাহরণস্বরূপ, ডকুমেন্ট বা পৃষ্ঠা লোড করার সময় আপনি যে ফাংশনটি লোড করতে চান তাকে "আপনার ফাংশন" বলা হয়। ডকুমেন্টের লোড ইভেন্টে ফাংশনটি কল করে এটি করা যেতে পারে। আরও বিস্তারিত জানার জন্য নীচের কোড দেখুন।

নীচের কোডটি ব্যবহার করে দেখুন:

<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script type="text/javascript">

    $(document).ready(function () {
        yourFunction();
    });
    function yourFunction(){
      //some code
    }
</script>

— আমির মোঃ আমিরুজ্জামান
সূত্র

6

কৌশলটি এখানে (সর্বত্র কাজ করে):

r(function(){
alert('DOM Ready!');
});
function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()}

— অভিষেক
সূত্র

1

লোড হওয়া এইচটিএমএল সনাক্ত করার জন্য (সার্ভার থেকে) MutationObserverDোকানো into

কোড স্নিপেট দেখান

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


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

loadContent('Senna');
loadContent('Anna');
loadContent('John');

<div id="content"><div>

স্নিপেট প্রসারিত করুন

— কামিল কিয়েসজেউস্কি
সূত্র