বাহ্যিক জাভাস্ক্রিপ্ট ফাইল লোড হচ্ছে না

আমি আমার home.html পৃষ্ঠাতে একটি বাহ্যিক জাভাস্ক্রিপ্ট ফাইল "check.js" অন্তর্ভুক্ত করেছি কিন্তু মনে হচ্ছে এটি কাজ করছে না। Check.js এর কোড এখানে দেওয়া হল:

function required()
{   var empt=document.forms["form1"]["city_name"].value;
    if(empt=="")
    {
        alert("City name is required");
        return false;
    }
    return true;
}

এবং home.html এর জন্য কোডটি হল:

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8" />
    <title>Weather Forecast</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" media="screen" href="/static/main.css" />
    <script src="check.js"></script>
    <link rel="shortcut icon" type="image/x-icon" href="/static/favicon.ico" />
</head>
<body>
    
<form name="form1" action='/weather' method="post" autocomplete="off" onsubmit="required()">

City Name:

<input class="input1" type="text" name="city_name" onfocus="this.value=''" value="enter city name here....">  
<input class="input2" type="submit" name="form" value="Submit"> </form> </body> </html>

কোনো সমস্যা??

0
যদি আপনি পৃষ্ঠাটিতে স্ক্রিপ্ট ইনলাইনটি আটকে থাকেন তবে এটি এখন কীভাবে কাজ করে? যদি এটি না হয় তবে ফাইল অন্তর্ভুক্তি আপনার সমস্যা নয়।
যোগ লেখক Taplar, উৎস
আপনি কি ত্রুটি পেয়েছেন?
যোগ লেখক Vivek jain, উৎস

5 উত্তর

আপনার কোডটি লিখেছেন এটি কাজ করছে। সতর্কতা কখনই দেখানো হবে না কারণ মানটি খালি নেই। আপনার ইনপুট উপাদানটির একটি মান পরিবর্তে এটি ব্যবহার করার জন্য একটি স্থানধারক বৈশিষ্ট্যটি ব্যবহার করুন:

placeholder="enter city name here...."
0
যোগ

কারণ হ্যান্ডলারের কাছ থেকে ফেরত মানটি ইভেন্টটি বাতিল হয়ে থাকলে তা নির্ধারণ করে আপনাকে এই বিভাগটি পরিবর্তন করতে হবে:

onsubmit="required()"

সঙ্গে:

onsubmit="return required()"

<div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false"> <div class="snippet-code snippet-currently-hidden">

function required(e)
{   var empt=document.forms["form1"]["city_name"].value;
    if(empt=="")
    {
        console.log("City name is required");
        return false;
    }
    return true;
}
<form name="form1" action='/weather' method="post" autocomplete="off" onsubmit="return required()">
    

City Name:

<input class="input1" type="text" name="city_name" onfocus="this.value=''" value="enter city name here....">  
<input class="input2" type="submit" name="form" value="Submit"> </form>
</div> </div>

0
যোগ

There are a few problems here. Firstly, you can't have a <form> element inside a

element, so your HTML should look like:

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Weather Forecast</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" media="screen" href="/static/main.css" />
        <script src="check.js"></script>
        <link rel="shortcut icon" type="image/x-icon" href="/static/favicon.ico" />
    </head>
    <body>
        <form name="form1" action="/weather" method="post" autocomplete="off" onsubmit="required()">
            

City Name:

<input class="input1" type="text" name="city_name" onfocus="this.value=''" value="enter city name here....">  
<input class="input2" type="submit" name="form" value="Submit"> </form> </body> </html>

দ্বিতীয়ত, জমা দেওয়ার জন্য আপনাকে ফর্মটি বন্ধ করতে হবে যাতে এটি চেক করা যায়, তবে এটি দারুন হলে, যেখানে তথ্যটি জমা দেওয়ার জন্য আপনাকে ফর্মটি প্রয়োজন। এটি সমাধান করার জন্য, onsubmit ফর্মের পরিবর্তে onclick ইভেন্টের প্রয়োজনীয়() আগুনটি তৈরি করুন। এছাড়াও ব্যবহার করার জন্য একটি e আর্গুমেন্ট যুক্ত করুন:

<form name="form1" action="/weather" method="post" autocomplete="off">
    

City Name:

<input class="input1" type="text" name="city_name" onfocus="this.value=''" value="enter city name here....">  
<input class="input2" type="submit" name="form" value="Submit" onclick="required(e)"> </form>

মান এর পরিবর্তে আপনার ইনপুট এর জন্য স্থানধারক পাঠ্য দরকার, তাই লোকেরা যদি এটি স্পর্শ না করে তবে এটি আসলে পূরণ হয় না:

<input class="input1" type="text" name="city_name" onfocus="this.value=''" placeholder="enter city name here....">

এবং তারপর আপনার ফাংশন এই মত চেহারা:

function required(event) {
    event.preventDefault();
    var empt=document.forms["form1"]["city_name"].value;
    if(!empt) {
        alert("City name is required");
        return;
    }
    document["form1"].submit();
}

এবং যে এখন কাজ করা উচিত!

0
যোগ
আমি পরিবর্তন করেছি কিন্তু এটি এখনও কাজ করছে না !!
যোগ লেখক nick, উৎস

HTML ফাইলে একটি ইনলাইন স্ক্রিপ্ট ব্যবহার করুন:

<script>
    your code here
</script>
0
যোগ

Fixed: 1 - use getElementByID 2 - you have a value set, test for that as well 3 - add return to your onsubmit

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code">

function required()
{   let empt=document.getElementById("city_name").value;

    if(empt=="" || empt.includes("enter"))
    {
        //alert("City name is required");
        return false      
    }
    return true;
}
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8" />
    <title>Weather Forecast</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" media="screen" href="/static/main.css" />
    <script src="check.js"></script>
    <link rel="shortcut icon" type="image/x-icon" href="/static/favicon.ico" />
</head>
<body>
    
<form name="form1" action='/weather' method="post" autocomplete="off" onsubmit="return required()">

City Name:

<input class="input1" type="text" id="city_name" name="city_name" onfocus="this.value=''" value="enter city name here....">  
<input class="input2" type="submit" name="form" value="Submit"> </form> </body> </html>
</div> </div>

0
যোগ
স্ক্রিন ফাইলটি লোড হচ্ছে কিনা তা দেখার জন্য @ নিক ইন ক্রোম আপনি ইন্সপেক্টর ব্যবহার করেছেন? যদি তাই হয়, একটি বিরতি বিন্দু যোগ করুন।
যোগ লেখক Paul Thomas, উৎস
এখনও আমার জন্য কাজ না !!!
যোগ লেখক nick, উৎস