অন্য জেএস ফাইলে জাভাস্ক্রিপ্ট ফাংশন কল করা

Question

আমি দ্বিতীয়.জেএস ফাইলে ফার্স্ট.জেএস ফাইলে সংজ্ঞায়িত ফাংশনটি কল করতে চেয়েছিলাম। দুটি ফাইলই এইচটিএমএল ফাইলে সংজ্ঞায়িত করা হয়:

<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>

আমি কল করতে চান fn1()সংজ্ঞায়িত first.jsমধ্যে second.js। আমার অনুসন্ধানগুলি থেকে উত্তরগুলি আগে first.jsসংজ্ঞায়িত করা থাকলে এটি সম্ভব তবে আমার পরীক্ষাগুলি থেকে আমি এটি করার কোনও উপায় খুঁজে পাইনি।

আমার কোডটি এখানে:

second.js

document.getElementById("btn").onclick = function() {
    fn1();
}

first.js

function fn1() {
    alert("external fn clicked");
}

Comments

সুতরাং এটি কল করুন, বিশ্বব্যাপী সুযোগে যতক্ষণ আছে তেমন বিশেষ কিছুই নেই।

— এপাসকেলো

আমরা সকলেই প্রতিদিন এক হাজার বার এটি করে যাচ্ছি। যদি আপনি না করতে পারেন তবে আপনার প্রথম জেজে সমস্যা থাকতে হবে: এটি আপনার ব্রাউজারে আদৌ লোড করা হয়েছে কিনা তা পরীক্ষা করুন এবং যদি হ্যাঁ, পার্স করার সময় একটি সিনট্যাক্স ত্রুটি হয়েছিল কিনা (উভয়টি বিকাশকারীর সরঞ্জামদণ্ডে দেখা যেতে পারে) আপনার ব্রাউজারের)

— rplantiko

এটা কাজ করা উচিত। আপনি যখন Chrome বা ফায়ারফক্স / ফায়ারব্যাগে জাভাস্ক্রিপ্ট কনসোল ব্যবহার করে এটি চালান তখন কী হয় তা আমাদের জানানোর জন্য আপনার প্রশ্নটি সম্পাদনা করুন। (উম, এবং পরীক্ষা করুন যে আপনি ফাংশনটির নামটি সঠিকভাবে বানান করেছেন))

— বব ব্রাউন

যদি এটি কাজ না করে তবে আমার ধারণা আপনি কিছু ভুল করছেন। আপনার প্রশ্নের তথ্য প্রদত্ত, এটি হওয়া অসম্ভব।

— ফেলিক্স ক্লিং

আসল কোড করা উচিত।

— এপাসকারেলো

Answer 1

কোনও ফাংশন বলা যাবে না যদি না এটি একই ফাইলে সংজ্ঞায়িত করা হত বা কল করার প্রচেষ্টার আগে লোড হওয়া একটি।

কোনও ফাংশনটি একই বা বৃহত্তর স্কোপে না থাকলে কল করা যায় না তবে যেটি কল করার চেষ্টা করে।

আপনি fn1প্রথম.জেজে ফাংশন ঘোষণা করেন এবং তারপরে দ্বিতীয়টিতে আপনি ঠিক রাখতে পারেনfn1();

1.js:

function fn1 () {
    alert();
}

2.js:

fn1();

index.html:

<script type="text/javascript" src="1.js"></script>
<script type="text/javascript" src="2.js"></script>

Comments

তাহলে কোনও প্রোডাকশন অ্যাপ্লিকেশনটিতে এই সমস্ত পরিচালনা করার সর্বোত্তম উপায় কী?

— কোস্টা

এটি আমার পক্ষে কাজ করে না একটি ত্রুটি দেয় যে fn1 () সংজ্ঞায়িত করা হয়নি

— আয়ুষি

এটি আমার পক্ষেও কাজ করে না। জ্যাকোরি গেস্ট্রিপ্ট ব্যবহার করা ছাড়া কোনও কাজ কি খারাপ অভ্যাসের প্রস্তাব দেয়?

— ভ্যানডল্ফ রেয়েস

সত্যিকারের কাজ না হলে এটি কেন 82 টি ভোট দিয়ে গৃহীত উত্তর?

— ড্যানিয়েল

যদি এটি আপনার পক্ষে কাজ করে না, তবে সম্ভাবনাগুলি কি আপনি অন্য কোনও কিছুর মধ্যে ফাংশনটি সংজ্ঞায়িত করছেন। উদাহরণস্বরূপ, আমার একটি $(document).ready(function() {...})ব্লকের মধ্যে আমার ফাংশন ছিল এবং এটি কার্যকর হয়নি। আমি এটি সরিয়ে নিয়েছি এবং এটি একটি কবজির মতো কাজ করেছে।

— মাইকেল জিলাক

Answer 2

আপনি এই ফাংশনটিকে বৈশ্বিক পরিবর্তনশীল করে তুলতে first.js পারেন এবং বন্ধ করে দেখুন এবং এটিকে স্থাপন করবেন নাdocument.ready এটি বাইরে রাখেন না

আপনিও এজ্যাক্স ব্যবহার করতে পারেন

    $.ajax({
      url: "url to script",
      dataType: "script",
      success: success
    });

একইভাবে আপনি jquery getScript ব্যবহার করতে পারেন

$.getScript( "ajax/test.js" )
  .done(function( script, textStatus ) {
    console.log( textStatus );
  })
  .fail(function( jqxhr, settings, exception ) {
    $( "div.log" ).text( "Triggered ajaxError handler." );
});

Comments

নতুনরা কখনও এ জাতীয় কিছু করার চেষ্টা করে না। এগুলি এড়াতে বাজে অভ্যাসগুলি। যতক্ষণ না উভয়ই ওয়েব পৃষ্ঠা দ্বারা রেফারেন্স করা হয়, হ্যাঁ। আপনি কেবল ফাংশনগুলিকে কল করুন যেন তারা একই জেএস ফাইলে রয়েছে।

— আনন্দ

একমাত্র বিষয়টি হ'ল এটি কোনও কারণে শিরোনামকে অন্তর্ভুক্ত করে না।

— সি 8

Answer 3

১ ম জেএস:

function fn(){
   alert("Hello! Uncle Namaste...Chalo Kaaam ki Baat p Aate h...");
}

২ য় জেএস:

$.getscript("url or name of 1st Js File",function(){
fn();
});

আশা করি এটি সাহায্য করবে ... শুভ কোডিং।

Comments

আমি মনে করি আপনি বোঝাতে চেয়েছেনjQuery.getScript()

— পিএমপিআর

Answer 4

আপনি es6 আমদানি রফতানি বাক্য গঠন ব্যবহার করে বিবেচনা করতে পারেন। ফাইল 1 এ;

export function f1() {...}

এবং তারপরে ফাইল 2 এ;

import { f1 } from "./file1.js";
f1();

দয়া করে মনে রাখবেন যে আপনি যদি এটি ব্যবহার করেন তবে এটি কাজ করে <script src="./file2.js" type="module">

আপনি যদি এইভাবে এটি করেন তবে আপনার দুটি স্ক্রিপ্ট ট্যাগ লাগবে না। আপনার কেবল প্রধান স্ক্রিপ্ট প্রয়োজন এবং আপনি আপনার অন্যান্য জিনিসগুলি এখানে আমদানি করতে পারেন।

Comments

সাফারি সহ, আমি পেয়েছিcross-origin script load denied by cross-origin resource sharing policy

— kakyo

পুরানো ব্রাউজারগুলির সাথে আপনি এস 6 টি আমদানি বাক্য গঠন ব্যবহার করতে পারবেন না। আপনি বাবেলটি যদি এটি আপনার পক্ষে সহজ করে তোলে তা আপনি ব্যবহার করতে পারেন।

— tm2josep

Answer 5

এটি এর মতো কাজ করা উচিত:

1.js

function fn1() {
  document.getElementById("result").innerHTML += "fn1 gets called";
}

2.js

function clickedTheButton() {
  fn1();
} 

index.html

<html>
  <head>
  </head>
  <body>
    <button onclick="clickedTheButton()">Click me</button>
    <script type="text/javascript" src="1.js"></script>
    <script type="text/javascript" src="2.js"></script>
  </body>
 </html>

আউটপুট

এই কোডপেন স্নিপেট চেষ্টা করুন: লিঙ্ক ।

Answer 6

দয়া করে মনে রাখবেন এটি কেবল তখনই কাজ করে

<script>

ট্যাগগুলি শরীরে থাকে এবং মাথায় থাকে না।

সুতরাং

<head>
...
<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>
</head>

=> অজানা ফাংশন fn1 ()

ব্যর্থ এবং

<body>
...
<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>
</body>

কাজ করে।

Answer 7

আপনার সার্ভারটি গতি উন্নত করার অনুমতি দিলে ক্যাশে ব্যবহার করুন।

var extern =(url)=> {           // load extern javascript
    let scr = $.extend({}, {
        dataType: 'script',
        cache: true,
        url: url
    });
    return $.ajax(scr);
}
function ext(file, func) {
    extern(file).done(func);    // calls a function from an extern javascript file
}

এবং তারপরে এটি ব্যবহার করুন:

ext('somefile.js',()=>              
    myFunc(args)
);  

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

Answer 8

first.js

function first() { alert("first"); }

Second.js

var imported = document.createElement("script");
imported.src = "other js/first.js";  //saved in "other js" folder
document.getElementsByTagName("head")[0].appendChild(imported);


function second() { alert("Second");}

index.html

 <HTML>
    <HEAD>
       <SCRIPT SRC="second.js"></SCRIPT>
    </HEAD>
    <BODY>
       <a href="javascript:second()">method in second js</a><br/>
       <a href="javascript:first()">method in firstjs ("included" by the first)</a>
    </BODY>
</HTML>

Answer 9

window.onload = function(){
    document.getElementById("btn").onclick = function(){
        fn1();
    }
   // this should work, It calls when all js files loaded, No matter what position you have written
});

Comments

যদিও আপনার কোড স্নিপেটটি সমস্যাটি সমাধান করতে পারে, আপনার কোডটির উদ্দেশ্য কী তা বর্ণনা করা উচিত (এটি কীভাবে সমস্যার সমাধান করে)। এছাড়াও, আপনি স্ট্যাকওভারফ্লো.com

— আহমদ এফ

Answer 10

উইন্ডো সহ গ্লোবাল স্কোপে ফাংশন ঘোষণা করুন

first.js

window.fn1 = function fn1() {
    alert("external fn clicked");
}

second.js

document.getElementById("btn").onclick = function() {
   fn1();
}

এই মত অন্তর্ভুক্ত

<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>

Answer 11

এটি আসলে খুব দেরিতে আসছে, তবে আমি ভেবেছিলাম আমার ভাগ করা উচিত,

ইনডেক্স। html এ

<script type="text/javascript" src="1.js"></script>
<script type="text/javascript" src="2.js"></script>

1.js এ

fn1 = function() {
    alert("external fn clicked");
}

2.js এ

fn1()

Comments

দয়া করে প্রশ্নের নীচে ওপির মন্তব্য দেখুন: "... আমি ঠিক একই নামের সাথে একটি ভুল অবস্থানে অবস্থিত একটি ফাইল [পরীক্ষা করে] নিচ্ছি ..."।

— traktor53

Answer 12

ফাংশন তৈরি করার সময় "var" ব্যবহার করুন, তারপরে আপনি এটি অন্য কোনও ফাইল থেকে অ্যাক্সেস করতে পারবেন। উভয় ফাইলই আপনার প্রকল্পের সাথে ভালভাবে সংযুক্ত রয়েছে এবং একে অপরকে অ্যাক্সেস করতে পারে তা নিশ্চিত করুন।

file_1.js

var firstLetterUppercase = function(str) {
   str = str.toLowerCase().replace(/\b[a-z]/g, function(letter) {
      return letter.toUpperCase();
   });
   return str;
}

এই ফাংশন / ভেরিয়েবল ফর্ম file_2.js ফাইল অ্যাক্সেস করা

firstLetterUppercase("gobinda");

আউটপুট => গোবিন্দ

আশা করি এটি কাউকে সাহায্য করবে, শুভ কোডিং !!!

Answer 13

// module.js
export function hello() {
  return "Hello";
}

// main.js
import {hello} from 'module'; // or './module'
let val = hello(); // val is "Hello";

https://hype.codes/how-incolve-js-file-another-js-file থেকে রেফারেন্স

Answer 14

আমারও একই সমস্যা হয়েছে। আমি jquery ডকুমেন্ট রেডি ফাংশন ভিতরে ফাংশন সংজ্ঞায়িত করেছি ।

$(document).ready(function() {
   function xyz()
   {
       //some code
   }
});

এবং এই ফাংশন xyz () আমি অন্য একটি ফাইলে কল করেছি। এটি কাজ করে না :) আপনাকে উপরের ডকুমেন্টের জন্য প্রস্তুত ফাংশনটি নির্ধারণ করতে হবে ।