javascript - জাভাস্ক্রিপ্ট লিঙ্কে কোন "href" মানটি ব্যবহার করা উচিত, "#" বা "জাভাস্ক্রিপ্ট: অকার্যকর(0)"?




html performance (20)

আদর্শভাবে আপনি এই কাজ করতে হবে:

<a href="javascriptlessDestination.html" onclick="myJSFunc(); return false;">Link text</a>

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

নিম্নলিখিত লিঙ্কটি তৈরি করার দুটি পদ্ধতি রয়েছে যা জাভাস্ক্রিপ্ট কোড চালানোর একমাত্র উদ্দেশ্য রয়েছে। কার্যকারিতা, পৃষ্ঠা লোড গতি, বৈধতা উদ্দেশ্যে ইত্যাদি শর্তাবলী, যা ভাল?

function myJsFunc() {
    alert("myJsFunc");
}
<a href="#" onclick="myJsFunc();">Run JavaScript Code</a>

অথবা

function myJsFunc() {
    alert("myJsFunc");
}
 <a href="javascript:void(0)" onclick="myJsFunc();">Run JavaScript Code</a>


আপনি যদি আমাকে জিজ্ঞাসা না;

যদি আপনার "লিঙ্ক" কিছু জাভাস্ক্রিপ্ট কোড চালানোর একমাত্র উদ্দেশ্য থাকে তবে এটি একটি লিঙ্ক হিসাবে যোগ্য নয়; পরিবর্তে একটি জাভাস্ক্রিপ্ট ফাংশন সঙ্গে টেক্সট একটি টুকরা এটি মিলিত। আমি এটিতে সংযুক্ত একটি onclick handler সাথে একটি <span> ট্যাগ ব্যবহার করতে এবং একটি লিঙ্ককে অনুলিপি করার জন্য কিছু মৌলিক CSS ব্যবহার করার সুপারিশ করব। লিঙ্কগুলি নেভিগেশনের জন্য তৈরি করা হয় এবং যদি আপনার জাভাস্ক্রিপ্ট কোডটি নেভিগেশনের জন্য না হয় তবে এটি <a> ট্যাগ হওয়া উচিত নয়।

উদাহরণ:

function callFunction() { console.log("function called"); }
.jsAction {
    cursor: pointer;
    color: #00f;
    text-decoration: underline;
}
<p>I want to call a JavaScript function <span class="jsAction" onclick="callFunction();">here</span>.</p>


আমরাও।

যদি আপনি একটি প্রকৃত URL থাকতে পারেন যা HREF হিসাবে অর্থে ব্যবহার করে। কেউ যদি নতুন লিঙ্কটি খুলতে আপনার লিঙ্কের মধ্যম-ক্লিকগুলি বা জাভাস্ক্রিপ্ট নিষ্ক্রিয় থাকে তবে অনকেলকটি আগুন লাগবে না।

যদি এটি সম্ভব না হয়, তবে অন্তত জাভাস্ক্রিপ্ট এবং উপযুক্ত ক্লিক ইভেন্ট হ্যান্ডলারগুলির সাথে ডকুমেন্টের মধ্যে নোঙ্গর ট্যাগটিকে ইনজেক্ট করা উচিত।

আমি এটা সর্বদা সম্ভব নয় বুঝতে পারছি, কিন্তু আমার মতে এটি কোনও পাবলিক ওয়েবসাইট তৈরির জন্য কঠোর হওয়া উচিত।

অকার্যকর জাভাস্ক্রিপ্ট এবং অগ্রগতিশীল উন্নতকরণ (উইকিপিডিয়া উভয়) দেখুন।


আমি javascript:void(0) ব্যবহার javascript:void(0)

তিনটি কারণ। # ডেভেলপারদের একটি দলের মধ্যে ব্যবহারকে উত্সাহিত করা অবশ্যম্ভাবীভাবে ফাংশনের ফিরতি মান ব্যবহার করে কিছুকে নেতৃত্ব দেয়:

function doSomething() {
    //Some code
    return false;
}

কিন্তু তারপর তারা return doSomething() ব্যবহার করতে ভুলে যান এবং কেবল কিছু ব্যবহার doSomething()

# এড়িয়ে চলার দ্বিতীয় কারণ হলো চূড়ান্ত return false; বলা ফাংশন যদি একটি ত্রুটি ছোঁড়ে নির্বাহ করা হবে না। সুতরাং ডেভেলপারদের বলা ফাংশন যথাযথভাবে কোনো ত্রুটি হ্যান্ডেল মনে আছে।

তৃতীয় কারণ হল যে onclick ঘটনা সম্পত্তি গতিশীলভাবে বরাদ্দ করা হয়। আমি একটি ফাংশন কল বা সংযুক্তি বা অন্য এক পদ্ধতির জন্য ফাংশন কোড ছাড়া গতিশীলভাবে বরাদ্দ করতে সক্ষম হতে পছন্দ। অতএব এইচটিএমএল মার্কআপে আমার onclick (বা কিছু) এভাবে দেখায়:

onclick="someFunc.call(this)"

অথবা

onclick="someFunc.apply(this, arguments)"

javascript:void(0) ব্যবহার করে javascript:void(0) উপরের মাথাব্যাথাগুলির সবগুলি এড়িয়ে চলছে এবং আমি কোনও উপকারের উদাহরণ খুঁজে পাইনি।

সুতরাং আপনি যদি একমাত্র বিকাশকারী হন তবে আপনি স্পষ্টভাবে নিজের পছন্দটি তৈরি করতে পারেন, তবে আপনি যদি একটি টিম হিসাবে কাজ করেন তবে আপনাকে অবশ্যই এইটি জানাতে হবে:

href="#" ব্যবহার করুন, নিশ্চিত করুন যে onclick সর্বদা return false; রয়েছে return false; শেষ পর্যন্ত, যে কোনও ফাংশন কোনও ত্রুটি নিক্ষেপ করে না এবং যদি আপনি অননুমোদিতভাবে কোনও ফাংশনটিকে onclick সম্পত্তির সাথে সংযুক্ত করে থাকেন তবে নিশ্চিত করুন যে ত্রুটিটি নিক্ষেপ করার পাশাপাশি এটি false ফেরত false

অথবা

href="javascript:void(0)"

দ্বিতীয় স্পষ্টভাবে যোগাযোগ করা সহজতর।


আমি অন্য কোথাও পরামর্শ দিয়ে একমত যে আপনি href মধ্যে নিয়মিত URL ব্যবহার করতে হবে, তারপরে কিছু জাভাস্ক্রিপ্ট ফাংশনকে অন-ক্লিকে কল করুন। ত্রুটি হল, তারা automaticaly কল পরে return false যোগ করুন।

এই পদ্ধতির সমস্যাটি হল যে, যদি ফাংশন কাজ না করে তবে কোনও সমস্যা হবে, লিঙ্কটি অচল হয়ে যাবে। Onclick ইভেন্ট সবসময় false ফেরত হবে, তাই স্বাভাবিক URL বলা হবে না।

খুব সহজ সমাধান আছে। সঠিকভাবে কাজ করে যদি ফাংশন true ফিরে যাক। তারপরে ক্লিকটি বাতিল করা উচিত কিনা তা নির্ধারণের জন্য ফেরত মানটি ব্যবহার করুন:

জাভাস্ক্রিপ্ট

function doSomething() {
    alert( 'you clicked on the link' );
    return true;
}

এইচটিএমএল

<a href="path/to/some/url" onclick="return !doSomething();">link text</a>

মনে রাখবেন, আমি doSomething() ফাংশনের ফলাফলটি অস্বীকার করি। যদি এটি কাজ করে তবে এটি true ফিরে আসবে, তাই এটি বাতিল করা হবে ( false ) এবং path/to/some/URL বলা হবে না। যদি ফাংশন মিথ্যাটি ফেরত false (উদাহরণস্বরূপ, ব্রাউজারটি ফাংশনের মধ্যে ব্যবহৃত কিছুকে সমর্থন করে না বা অন্য কিছু ভুল হয়), এটি true অস্বীকার করে এবং path/to/some/URL টি বলা হয়।


আমি নিম্নলিখিত ব্যবহার

<a href="javascript:;" onclick="myJsFunc();">Link</a>

পরিবর্তে

<a href="javascript:void(0);" onclick="myJsFunc();">Link</a>

আমি ব্যবহার করব:

<a href="#" onclick="myJsFunc();return false;">Link</a>

কারণ:

  1. এই href সহজ করে তোলে, সার্চ ইঞ্জিন এটি প্রয়োজন। যদি আপনি অন্য কিছু ব্যবহার করেন (যেমন একটি স্ট্রিং), এটি একটি 404 not found ত্রুটি 404 not found
  2. যখন মাউস লিংকটির উপর জোর দেয়, তখন এটি একটি স্ক্রিপ্ট দেখায় না।
  3. return false; ব্যবহার করে return false; , পৃষ্ঠা শীর্ষে লাফ বা back বাটন বিরতি না।

আমি সাধারণত জন্য যান

<a href="javascript:;" onclick="yourFunction()">Link description</a>

এটা জাভাস্ক্রিপ্ট চেয়ে ছোট: অকার্যকর (0) এবং একই কাজ করে।


নিশ্চিতভাবে হ্যাশ ( # ) ভাল কারণ জাভাস্ক্রিপ্টে এটি একটি ছদ্মবেশী:

  1. দূষণ ইতিহাস
  2. ইঞ্জিন নতুন কপি তাত্ক্ষণিক
  3. আন্তর্জাতিক সুযোগ রান এবং ইভেন্ট সিস্টেম সম্মান না।

অবশ্যই "#" একটি অনকেল হ্যান্ডলার যা ডিফল্ট অ্যাকশনকে বাধা দেয় [অনেক] ভাল। তাছাড়া, জাভাস্ক্রিপ্ট চালানোর একমাত্র উদ্দেশ্য রয়েছে এমন একটি লিঙ্কটি আসলে "একটি লিংক" না হওয়া পর্যন্ত আপনি কোনও সমস্যা হলে পৃষ্ঠাটিতে কিছু সন্দিহান নোঙ্গর ব্যবহারকারীকে পাঠাচ্ছেন (শুধু # উপরে পাঠাতে হবে)। আপনি সহজেই স্টাইলশীট সঙ্গে লিংক চেহারা এবং অনুভূতি অনুকরণ এবং প্রায় href সম্পর্কে ভুলে যেতে পারেন।

এছাড়াও, গওগডের পরামর্শ সম্পর্কিত, বিশেষ করে এই: ...href="javascript_required.html" onclick="... এটি ভাল পদ্ধতি, তবে এটি" জাভাস্ক্রিপ্ট নিষ্ক্রিয় "এবং" অনুলিপি ব্যর্থ "পরিস্থিতিতে পার্থক্য করে না।


প্রথমটি, ব্যবহারকারীর জাভাস্ক্রিপ্ট নিষ্ক্রিয় থাকলে অনুসরণ করার জন্য আদর্শ লিঙ্কের সাথে আদর্শ। জাভাস্ক্রিপ্ট কার্যকর হলে কেবল ফায়ারিংয়ের ক্লিক ইভেন্টটি প্রতিরোধ করতে মিথ্যা ফিরতে ভুলবেন না।

<a href="#" onclick="myJsFunc(); return false;">Link</a>

আপনি Angular2 ব্যবহার করলে, এইভাবে কাজ করে:

<a [routerLink]="" (click)="passTheSalt()">Click me</a>

এখানে দেখুন https://.com/a/45465728/2803344


# javascript:anything চেয়ে ভাল javascript:anything , কিন্তু নিম্নলিখিত আরও ভাল:

এইচটিএমএল:

<a href="/gracefully/degrading/url/with/same/functionality.ext" class="some-selector">For great justice</a>

javascript:

$(function() {
    $(".some-selector").click(myJsFunc);
});

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


<a href="#" onclick="myJsFunc();">Link</a> বা <a href="javascript:void(0)" onclick="myJsFunc();">Link</a> অথবা যাই হোক না কেন অন্য একটি onclick বৈশিষ্ট্য রয়েছে - পাঁচ বছর আগে ঠিক আছে, যদিও এখন এটি একটি খারাপ অভ্যাস হতে পারে। কারণটা এখানে:

  1. এটি নিষ্ক্রিয় জাভাস্ক্রিপ্টের অনুশীলনকে প্রচার করে - যা বজায় রাখা কঠিন এবং পরিমাপ করা কঠিন হয়ে পড়েছে। Unobtrusive জাভাস্ক্রিপ্ট এই উপর আরো।

  2. আপনি আপনার সময় অবিশ্বাস্যভাবে অত্যধিক ক্রিয়াপদ কোড লেখার সময় ব্যয় করছেন - যা খুব কম (যদি থাকে) আপনার কোডবেসে উপকৃত হয়।

  3. এখন পছন্দসই ফলাফল সম্পন্ন করার জন্য আরও ভাল, সহজ, এবং আরো রক্ষণযোগ্য এবং আকার পরিবর্তনযোগ্য উপায় রয়েছে।

অকার্যকর জাভাস্ক্রিপ্ট উপায়

শুধু একটি href বৈশিষ্ট্য নেই সব আছে! কোনও ভাল CSS রিসেট অনুপস্থিত ডিফল্ট কার্সার শৈলীটির যত্ন নেবে, এটি একটি অ-ইস্যু। তারপরে আপনার জাভাস্ক্রিপ্ট লজিক্স আপনার মার্কআপের পরিবর্তে জাভাস্ক্রিপ্টে থাকা জাভাস্ক্রিপ্টের স্থিতিশীল এবং স্বতঃস্ফূর্ত সর্বোত্তম অনুশীলনগুলি ব্যবহার করে আপনার জাভাস্ক্রিপ্ট কার্যকারিতা সংযুক্ত করুন - যা আপনি যখন বড় আকারের জাভাস্ক্রিপ্ট অ্যাপ্লিকেশনগুলি বিকাশ করতে শুরু করেন তখন এটি অপরিহার্য যে আপনার যুক্তিটিকে বিভক্ত করতে হবে ব্ল্যাকবক্স উপাদান এবং টেম্পলেট। বৃহত্তর স্কেল জাভাস্ক্রিপ্ট অ্যাপ্লিকেশন আর্কিটেকচার এই উপর আরও

সহজ কোড উদাহরণ

// Cancel click event
$('.cancel-action').click(function(){
    alert('Cancel action occurs!');
});

// Hover shim for Internet Explorer 6 and Internet Explorer 7.
$(document.body).on('hover','a',function(){
    $(this).toggleClass('hover');
});
a { cursor: pointer; color: blue; }
a:hover,a.hover { text-decoration: underline; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="cancel-action">Cancel this action</a>

একটি Blackboxed Backbone.js উদাহরণ

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

নোট

  • a উপাদানতে href বৈশিষ্ট্যটি অামিটিং করা tab কী ন্যাভিগেশন ব্যবহার করে উপাদান অ্যাক্সেসযোগ্য হতে পারে না। আপনি যদি tab tabindex মাধ্যমে ঐ উপাদানের অ্যাক্সেসযোগ্য হতে চান তবে আপনি tabindex বৈশিষ্ট্যটি সেট করতে পারেন, বা এর পরিবর্তে button উপাদানগুলি ব্যবহার করতে buttonট্র্যাকার 1 এর উত্তরে উল্লিখিত স্বাভাবিক লিঙ্কগুলির মতো দেখতে আপনি সহজেই শৈলী বোতাম উপাদানগুলি দেখতে পারেন।

  • a উপাদানতে href বৈশিষ্ট্যটি অামিটিং করা হলে Internet Explorer 6 এবং Internet Explorer 7 এটিকে গ্রহণ করতে পারে না a:hover স্টাইলিং, যার জন্য আমরা a.hover পরিবর্তে a.hover মাধ্যমে এটি সম্পাদন করতে একটি সহজ JavaScript শিম যুক্ত করেছি। যা পুরোপুরি ঠিক আছে, যেমন আপনার যদি কোনও href গুণমান এবং কোনও দুর্দান্ত অবনতি না থাকে তবে আপনার লিঙ্কটি যেভাবেই কাজ করবে না - এবং আপনার জন্য বড় সমস্যাগুলি থাকবে।

  • যদি আপনি এখনও আপনার অ্যাক্সেসটি জাভাস্ক্রিপ্ট নিষ্ক্রিয় করে কাজ করতে চান তবে তারপরে এমন a উপাদান ব্যবহার করে যা একটি href বৈশিষ্ট্য যা কিছু URL এ চলে যা একটি অ্যাজাক্স অনুরোধের পরিবর্তে নিজে নিজে ব্যবস্থা করবে বা যাই হোক না কেন যেতে হবে। আপনি যদি এটি করছেন, তবে আপনি আপনার ক্লিক কলটিতে event.preventDefault() নিশ্চিত করতে চান তা নিশ্চিত করার জন্য বোতামটিতে ক্লিক করা হলে এটি লিঙ্কটি অনুসরণ করে না। এই বিকল্পটি আনন্দদায়ক অবনতি বলা হয়।


জাভাস্ক্রিপ্ট চলমান একমাত্র উদ্দেশ্য জন্য লিঙ্ক ব্যবহার করবেন না।

Href = "#" ব্যবহার পৃষ্ঠাটিকে শীর্ষে স্ক্রোল করে; অকার্যকর ব্যবহার (0) ব্রাউজারের মধ্যে নেভিগেশনাল সমস্যা সৃষ্টি করে।

পরিবর্তে, একটি লিঙ্ক ছাড়া অন্য একটি উপাদান ব্যবহার করুন:

<span onclick="myJsFunc()" class="funcActuator">myJsFunc</span>

এবং সিএসএস দিয়ে এটি শৈলী:

.funcActuator { 
  cursor: default;
}

.funcActuator:hover { 
  color: #900;
}

আপনি যা অর্জন করতে চান তার উপর নির্ভর করে, আপনি অনুলিপিটি ভুলে যেতে পারেন এবং শুধুমাত্র href ব্যবহার করতে পারেন:

<a href="javascript:myJsFunc()">Link Text</a>

এটা মিথ্যা ফিরে প্রয়োজন কাছাকাছি পায়। আমি #বিকল্পটি পছন্দ করি না , যেমন উল্লেখ করা হয়েছে, এটি ব্যবহারকারীকে পৃষ্ঠার শীর্ষে নিয়ে যাবে। যদি আপনার কাছে জাভাস্ক্রিপ্ট সক্রিয় না থাকে তবে ব্যবহারকারীকে পাঠানোর জন্য অন্য কোথাও যদি থাকে (যা আমি খুব কম কাজ করি তবে খুব ভাল ধারণা), তাহলে স্টিভের প্রস্তাবিত পদ্ধতিটি দুর্দান্ত কাজ করে।

<a href="javascriptlessDestination.html" onclick="myJSFunc(); return false;">Link text</a>

অবশেষে, javascript:void(0)যদি আপনি যে কোনও জায়গায় যেতে চান এবং আপনি কোনও জাভাস্ক্রিপ্ট ফাংশন কল করতে না চান তবে আপনি ব্যবহার করতে পারেন । আপনার যদি এমন কোনও ছবি থাকে যা আপনি একটি মাউসওভার ইভেন্টের সাথে ঘটতে চান তবে এটি দুর্দান্ত কাজ করে তবে ব্যবহারকারীর জন্য ক্লিক করার জন্য কিছু নেই।


এটা jQuery ব্যবহার করা ভাল হবে,

$(document).ready(function() {
    $("a").css("cursor", "pointer");
});

এবং উভয় বর্জন href="#"এবং href="javascript:void(0)"

নোঙ্গর ট্যাগ মার্কআপ মত হবে

<a onclick="hello()">Hello</a>

সহজ যথেষ্ট!


যখন আমি বেশ কয়েকটি ভুল লিঙ্ক পেয়েছি, আমি তাদের 'কোন লিঙ্ক' একটি শ্রেণী দিতে পছন্দ করি।

তারপর jQuery, আমি নিম্নলিখিত কোড যোগ করুন:

$(function(){
   $('.no-link').click(function(e){
       e.preventDefault();
   });
});

এবং এইচটিএমএল জন্য, লিঙ্কটি সহজভাবে

<a href="/" class="no-link">Faux-Link</a>

আমি নোঙ্গরগুলির জন্য ব্যবহার না করা পর্যন্ত হ্যাশ-ট্যাগগুলি ব্যবহার করতে পছন্দ করি না, এবং যখন আমি দুটিও বেশি ভুল-লিঙ্ক পেয়েছি তখন উপরেরটি করি, অন্যথায় আমি জাভাস্ক্রিপ্ট দিয়ে যাই: অকার্যকর (0)।

<a href="javascript:void(0)" class="no-link">Faux-Link</a>

সাধারণত, আমি শুধু একটি লিঙ্ক ব্যবহার করা এড়াতে চাই এবং কেবল একটি নির্দিষ্ট সময়ের মধ্যে কিছু মোড়ানো এবং এটি একটি পপ-আপ বা সামগ্রী-প্রকাশের মতো কিছু JavaScript কোড সক্রিয় করার উপায় হিসাবে ব্যবহার করি।


আমি বিশ্বাস করি আপনি একটি মিথ্যা ডাইকোটমি উপস্থাপন করছেন। এই শুধুমাত্র দুটি বিকল্প নয়।

মিঃ ডি 4 ভি 360 এর সাথে আমি একমত যে, আপনি নোঙ্গর ট্যাগটি ব্যবহার করছেন, তবে আপনার কাছে এখানে সত্যিই নোঙ্গর নেই। আপনার সমস্ত একটি দস্তাবেজের একটি বিশেষ বিভাগ যা সামান্য ভিন্ন আচরণ করা উচিত। একটি <span>ট্যাগ অনেক বেশি উপযুক্ত।


আমি মূলত প্রগতিশীল বৃদ্ধি ব্যবহার করে এই বাস্তব নিবন্ধ থেকে paraphrasing করছি । সংক্ষিপ্ত উত্তর হল যে আপনি কখনই ব্যবহার করবেন না javascript:void(0);বা #আপনার ব্যবহারকারীর ইন্টারফেসটি ইতিমধ্যে জাভাস্ক্রিপ্ট সক্ষম হয়ে গেছে বলে অনুমিত না হওয়া পর্যন্ত, আপনি কোন ক্ষেত্রে এটি ব্যবহার করতে চানjavascript:void(0); । এছাড়াও, লিঙ্ক হিসাবে স্পান ব্যবহার করবেন না, যেহেতু যে semantically সঙ্গে শুরু করতে মিথ্যা।

আপনার অ্যাপ্লিকেশনে SEO বন্ধুত্বপূর্ণ ইউআরএল রুটগুলি ব্যবহার করে , যেমন হোম / অ্যাকশন / পরামিতিগুলিও ভাল অভ্যাস। যদি আপনার কাছে এমন কোনও লিঙ্কের লিঙ্ক থাকে যা প্রথম জাভাস্ক্রিপ্ট ছাড়া কাজ করে তবে আপনি অভিজ্ঞতার পরে উন্নত করতে পারেন। একটি কাজের পৃষ্ঠাতে একটি বাস্তব লিঙ্কটি ব্যবহার করুন, তারপরে উপস্থাপনা উন্নত করতে একটি অনলিক ইভেন্ট যোগ করুন।

এখানে একটি নমুনা। হোম / চেঞ্জপিকচার ইউজার ইন্টারফেস এবং স্ট্যান্ডার্ড এইচটিএমএল জমা বোতামগুলির সাথে সম্পূর্ণ একটি পৃষ্ঠায় একটি ফর্মের একটি লিঙ্ক লিঙ্ক, তবে এটি jQueryUI বোতামগুলির সাথে একটি মোডাল ডায়ালগে ইনজেকশনের মতো সুন্দর। ব্রাউজারের উপর নির্ভর করে, যে কোনও উপায়ে কাজ করে, যা মোবাইলের প্রথম বিকাশকে সন্তুষ্ট করে।

<p><a href="Home/ChangePicture" onclick="return ChangePicture_onClick();" title="Change Picture">Change Picture</a></p>

<script type="text/javascript">
    function ChangePicture_onClick() {
        $.get('Home/ChangePicture',
              function (htmlResult) {
                  $("#ModalViewDiv").remove(); //Prevent duplicate dialogs
                  $("#modalContainer").append(htmlResult);
                  $("#ModalViewDiv").dialog({
                      width: 400,
                      modal: true,
                      buttons: {
                          "Upload": function () {
                              if(!ValidateUpload()) return false;
                              $("#ModalViewDiv").find("form").submit();
                          },
                          Cancel: function () { $(this).dialog("close"); }
                      },
                      close: function () { }
                  });
              }
        );
        return false;
    }
</script>

যদি আপনি AngularJS ব্যবহার করে থাকেন , আপনি নীচের ব্যবহার করতে পারেন:

<a href="">Do some fancy JavaScript</a>

যা কিছু করবে না।

এছাড়াও

  • এটি আপনাকে পৃষ্ঠার শীর্ষে নিয়ে যাবে না, যেমন (#)
    • অতএব, আপনি স্পষ্টভাবে falseজাভাস্ক্রিপ্ট সঙ্গে ফিরে প্রয়োজন হবে না
  • এটি একটি সংক্ষিপ্ত সংক্ষিপ্ত

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

উদাহরণ ... চলুন বলুন আপনার নিম্নলিখিত অনুসন্ধান লিঙ্ক আছে:

<a href="search.php" id="searchLink">Search</a>

আপনি সর্বদা নিম্নলিখিত করতে পারেন:

var link = document.getElementById('searchLink');

link.onclick = function() {
    try {
        // Do Stuff Here        
    } finally {
        return false;
    }
};

এইভাবে, জাভাস্ক্রিপ্ট দ্বারা নিষ্ক্রিয় ব্যক্তিদের জাভাস্ক্রিপ্ট সঙ্গে search.phpআপনার দর্শক আপনার উন্নত কার্যকারিতা দেখতে যখন নির্দেশ করা হয়।





href