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

4073

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

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>
স্নিপেট প্রসারিত করুন

javascript  html  performance  optimization  href 
— পিটার মর্টেনসেন
সূত্র
202
যতক্ষণ না আমি কিছু মিস করছি, <a href="javascript:void(0)" onclick="myJsFunc();">একেবারেই কোনও ধারণা নেই। আপনার যদি অবশ্যইjavascript: স্যুইডো-প্রোটোকল ব্যবহার করতে হয় তবে আপনার onclickপাশাপাশি বৈশিষ্ট্যটিরও প্রয়োজন নেই । <a href="javascript:myJsFunc();">ঠিক আছে।
— ওয়েসলি মার্চ
65
@ ওয়েজলিমার্চ - যদি myJsFunc()কোনও রিটার্ন মান থাকে তবে আপনার পৃষ্ঠাটি ভেঙে যাবে। jsfiddle.net/jAd9G আপনি এখনও চাই ব্যবহার করতে হবে voidযেমন: <a href="javascript:void myJsFunc();">। তবে তারপরেও আচরণটি আলাদা হতে পারে। প্রসঙ্গ মেনুর মাধ্যমে লিঙ্কটি চালানো clickইভেন্টটিকে ট্রিগার করে না ।
— gille3
38
শুধু কেন নয় <a href="javascript:;" onclick="myEvent()"?
— কে-
26
javascript:;এর চেয়ে টাইপ করা অনেক দ্রুতjavascript:void(0)
— মাইক কাউজার
78
প্রথমে এইটা দেখার সময় ভেবেছিলেন: "আপনি <a>যা করতে চান তা যদি আপনি কোনও ট্যাগ ব্যবহার করেন তবে স্থানীয় ব্রাউজার বৈশিষ্ট্যের মাধ্যমে অন্য পৃষ্ঠাটি না খোলার পরিবর্তে কিছু জাভাস্ক্রিপ্ট 'অ্যাকশন' ট্রিগার করা উচিত? কেবল spanক্লাসের সাথে ট্যাগ ব্যবহার করে? js-triggerসম্ভবত অনেক ভাল "। নাকি আমি কিছু মিস করছি?
— অ্যাড্রিয়েন

উত্তর:

2161

আমি ব্যবহার 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)উপরের সমস্ত মাথাব্যাথা ব্যবহার এড়ানো এবং আমি কোনও নেতিবাচক উদাহরণ খুঁজে পাইনি।

সুতরাং আপনি যদি নিঃসঙ্গ বিকাশকারী হন তবে আপনি পরিষ্কারভাবে নিজের পছন্দটি বেছে নিতে পারেন, তবে আপনি যদি একটি দল হিসাবে কাজ করেন তবে আপনাকে উভয়কেই বলা উচিত:

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

অথবা

ব্যবহার href="javascript:void(0)"

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

— অ্যান্টনিডব্লু জোন্স
সূত্র
329
আমি সর্বদা একটি নতুন ট্যাবে প্রতিটি লিঙ্কটি খুলি এবং এই কারণেই আমি ব্যক্তিগতভাবে এটি ঘৃণা করি যখন লোকেরা href="javascript:void(0)"পদ্ধতিটি ব্যবহার করে
— টিমো হুভিনেন
182
দুঃখিত, এই উত্তরটির এত উত্সাহ কেন? এর যে কোনও ব্যবহারকে javascript:খারাপ অভ্যাস হিসাবে বিবেচনা করা উচিত, বাধাজনক এবং দুর্দান্ত ডি-গ্রেড নয়।
— লঙ্ক্যমার্ট
52
পরবর্তী দুটি উত্তর এর চেয়ে অনেক ভাল এবং যুক্তিসঙ্গত। এছাড়াও প্রথম দুটি যুক্তিই অবৈধ কারণ event.preventDefault()ডিফল্ট আচরণ (যেমন পৃষ্ঠার শীর্ষে ঝাঁপ দেওয়ার মতো) প্রতিরোধ করার জন্য ঠিক সেখানে রয়েছে এবং সমস্ত return false;উন্মাদনা ছাড়াই এটিতে আরও ভাল কাজ করুন ।
— sudee
136
২০১৩-তে দ্রুত এগিয়ে নেওয়া: সিএসপি-সক্ষম এইচটিটিপিএস পৃষ্ঠাগুলিতে সামগ্রী সুরক্ষা নীতিjavascript:void(0) লঙ্ঘন করে । একটি বিকল্প ব্যবহার তারপর হবে এবং হ্যান্ডলার মধ্যে, কিন্তু আমি এই অনেক পছন্দ করি না। সম্ভবত আপনি ব্যবহার করার একটা ঝোঁক সম্মেলন স্থাপন করতে পারেন এবং নিশ্চিত পৃষ্ঠায় কোন উপাদান আছে করা । এইভাবে, অ-বিদ্যমান নোঙ্গরের লিঙ্কে ক্লিক করা পৃষ্ঠাটি স্ক্রোল করবে না। href='#'event.preventDefault()href='#void'id="void"
— jakub.g
24
আপনি "#" ব্যবহার করতে পারেন এবং তারপরে "#" এর সাথে সমস্ত লিঙ্কে একটি ক্লিক ইভেন্ট আবদ্ধ করতে পারেন href। এটি jQuery এর সাথে করা হবে:$('a[href="#"]').click(function(e) { e.preventDefault ? e.preventDefault() : e.returnValue = false; });
— নাথান
1324

আমরাও।

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

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

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

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

— হারুন ওয়াগনার
সূত্র
19
আপনি কীভাবে জাভাস্ক্রিপ্ট এবং উপযুক্ত ক্লিক ইভেন্ট হ্যান্ডলারের সাহায্যে নথিতে অ্যাঙ্কার ট্যাগ ইনজেক্ট করতে পারেন তার উদাহরণ দিতে পারেন?
— ব্যবহারকারী 456584
11
কেন অ্যাঙ্কর ট্যাগটি ইনজেক্ট করুন যদি এটি নিছক কোনও উপাদানকে ক হিসাবে ব্যবহার করার জন্য ব্যবহৃত হয়) ক্লিক করা খ) "পয়েন্টার" কার্সারটি প্রদর্শন করে। এমনকি এই দৃশ্যে একটি অ্যাঙ্কর ট্যাগ ইনজেকশন অপ্রাসঙ্গিক বলে মনে হচ্ছে।
— ক্রাশ করুন
12
উভয়ের জন্যই +1, তবে অনেকগুলি পন্থা রয়েছে। ফ্যাক্ট দেহাবশেষ পারেন ব্যবহার javascript:বা #উভয় খারাপ অভ্যাস ও না উৎসাহিত যেতে চলেছে। চমৎকার নিবন্ধ বিটিডব্লিউ।
— লঙ্ক্যমার্ট
13
@ ক্রাশ: আমি কোনও ডিভ বা স্প্যান ব্যবহার করতাম না; খোলামেলাভাবে, এটি মনে হয় খুব জিনিসটির <button>জন্য তৈরি হয়েছিল। তবে একমত: এটিতে <a>লিঙ্ক দেওয়ার উপযুক্ত জায়গা না থাকলে সম্ভবত এটি বিশেষভাবে হওয়া উচিত নয় ।
— সিএওও
14
@ সিএইচও বাটন সম্ভবত সেরা পছন্দ। আমি মনে করি মূল বিষয়টি হ'ল এইচটিএমএল উপাদানটি তার ডিফল্ট উপস্থাপনা উপস্থিতির উপর ভিত্তি করে নির্বাচন করা উচিত নয়, বরং ডকুমেন্টের কাঠামোর ক্ষেত্রে এর তাত্পর্য।
— পিষ্ট করুন
774

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

  1. এটি বিঘ্নযুক্ত জাভাস্ক্রিপ্টের অনুশীলনকে উত্সাহ দেয় - যা রক্ষণাবেক্ষণ করা কঠিন এবং স্কেল করা কঠিন বলে প্রমাণিত হয়েছে। এই বিষয়ে আরও কেবলমাত্র বাধাহীন জাভাস্ক্রিপ্ট ।

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

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

আপত্তিজনক জাভাস্ক্রিপ্ট উপায়

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

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

// 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>
স্নিপেট প্রসারিত করুন

একটি ব্ল্যাকবক্সযুক্ত ব্যাকবোন.জেএস উদাহরণ

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

মন্তব্য

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

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

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

— বালুপটন
সূত্র
163
সতর্কতা অবলম্বন করুন, href বৈশিষ্ট্যগুলি ছাড়াই ব্রাউজারের সাথে সামঞ্জস্যপূর্ণ নয় এবং আপনি ইন্টারনেট এক্সপ্লোরারগুলিতে হোভার ইফেক্টের মতো জিনিসগুলি হারাবেন
— টমাস ডেভিস
16
সাবধানতা: buttonএখানে প্রস্তাবিত লিঙ্ক-স্টাইলযুক্ত পদ্ধতির আইই 9 এবং তার চেয়ে কম অপ্রয়োজনীয় "3 ডি" সক্রিয় রাষ্ট্র দ্বারা জর্জরিত ।
— ব্রেনান রবার্টস
44
আমি এই উত্তরটি অত্যধিক কৌতূহলযুক্ত বলে মনে করি। এমন সময় আসে যখন আপনি কেবল 1 বা 2 একটি href এর জন্য জেএস আচরণটি প্রয়োগ করতে চান। সেক্ষেত্রে অতিরিক্ত সিএসএস সংজ্ঞায়িত করতে এবং পুরো জেএস ফাংশন ইনজেক্ট করার জন্য ওভারকিল ill কিছু ক্ষেত্রে (যেমন কোনও সিএমএসের মাধ্যমে সামগ্রী যুক্ত করা) আপনাকে আসলে নতুন সিএসএস বা স্ট্যান্ডলোন জেএস ইনজেক্ট করার অনুমতি দেওয়া হয় না , এবং ইনলাইনটি আপনি যা করতে পারেন তা সবই। আমি দেখতে পাচ্ছি না কিভাবে ইনলাইন সমাধান কোন কম রক্ষণীয় বাস্তবে জন্য 1 বা 2 সহজ JS একটি href আছে।
— এগুলি
17
সেই সমস্ত "নোটগুলি" যেগুলি সমাধান করা শক্ত (একটি ট্যাবিনডেক্স সেট করা একটি জটিল পৃষ্ঠায় সমস্যার জন্য জিজ্ঞাসা করছে!)। শুধু ভাল করা থেকে ভাল javascript:void(0)। এটি বাস্তববাদী উত্তর এবং বাস্তব বিশ্বের একমাত্র বুদ্ধিমান উত্তর answer
— অভি বেকার্ট
14
আপনি যদি নিজের ওয়েব অ্যাপ্লিকেশনটিকে অ্যাক্সেসযোগ্য (এবং আপনার হওয়া উচিত) তৈরি করার বিষয়ে চিন্তা করেন তবে সরলতা এবং বিচক্ষণতা href এর পক্ষে যুক্তি দেয়। পাগলামি tabindex দিক নির্দেশিত।
— jkade
328

'#'পৃষ্ঠার উপরে ব্যবহারকারী ফেরত নিতে তাই আমি সাধারণত সাথে যাব void(0)।

javascript:; মত আচরণ করে javascript:void(0);

— গাব রোগান
সূত্র
68
এটি এড়ানোর উপায় হ'ল অনক্লিক ইভেন্ট হ্যান্ডলারে মিথ্যা ফিরিয়ে আনা।
— গুভান্তে
34
ইভেন্ট হ্যান্ডলারে মিথ্যা ফিরিয়ে দেওয়া জাভাস্ক্রিপ্ট যদি জেএস সফলভাবে চলতে না পারে তা এড়ানো যায় না।
— কোয়ান্টিন
28
"#SomeNonExtivesAunchorName" ব্যবহার করা ভাল কাজ করে কারণ এতে কোথাও লাফানোর কোথাও নেই।
— স্কানলিফ
21
আপনার যদি বেস href থাকে, তবে #বা বর্তমান পৃষ্ঠার পরিবর্তে বেস href পৃষ্ঠায় #somethingসেই অ্যাঙ্কারে নিয়ে যাবেন ।
— অভি বেকার্ট
11
শেবাং ( #!) কৌশলটি করে তবে এটি অবশ্যই খারাপ অভ্যাস।
— নীল
276

আমি সৎভাবে উভয়ই সুপারিশ করব। আমি <button></button>সেই আচরণের জন্য একটি স্টাইলাইজড ব্যবহার করব।

button.link {
  display: inline-block;
  position: relative;
  background-color: transparent;
  cursor: pointer;
  border: 0;
  padding: 0;
  color: #00f;
  text-decoration: underline;
  font: inherit;
}
<p>A button that looks like a <button type="button" class="link">link</button>.</p>
স্নিপেট প্রসারিত করুন

এইভাবে আপনি আপনার অন্লিককে বরাদ্দ করতে পারেন। আমি স্ক্রিপ্টের মাধ্যমে বাঁধাইয়ের পরামর্শ দিই, onclickউপাদান ট্যাগটিতে অ্যাট্রিবিউটটি ব্যবহার না করে । একমাত্র গোটচা হ'ল পুরানো আই-এস-এ psuedo 3d পাঠ্য প্রভাব যা অক্ষম করা যায় না।

আপনি যদি হবে একটি A উপাদান ব্যবহার, ব্যবহার javascript:void(0);ইতিমধ্যে উল্লিখিত কারণের জন্য।

  • আপনার অন্লিক ইভেন্টটি ব্যর্থ হলে সর্বদা বিরত থাকবে।
  • ত্রুটিযুক্ত লোড কলগুলি ঘটবে না বা হ্যাশ পরিবর্তনের উপর ভিত্তি করে অন্যান্য ইভেন্টগুলি ট্রিগার করবে না
  • ক্লিকটি যদি (অনক্লিক থ্রো) মাধ্যমে আসে তবে হ্যাশ ট্যাগটি অপ্রত্যাশিত আচরণের কারণ হতে পারে, যদি না এটি উপযুক্ত পতনের মধ্য দিয়ে আচরণ না করা হয় এবং আপনি নেভিগেশনের ইতিহাস পরিবর্তন করতে চান।

দ্রষ্টব্য: আপনি 0স্ট্রিংয়ের সাহায্যে প্রতিস্থাপন করতে পারেন javascript:void('Delete record 123')যা অতিরিক্ত সূচক হিসাবে পরিবেশন করতে পারে যা ক্লিক আসলে কী করবে তা দেখায়।

— ট্র্যাকার 1
সূত্র
আইই 8 / আইই 9 তে, আমি বোতামটির সক্রিয় স্থানে 1px "3 ডি" অফসেটটি সরাতে অক্ষম।
— ব্রেনান রবার্টস
@ ব্রেনান রবার্টস হ্যাঁ, দুর্ভাগ্যক্রমে, বোতামগুলির যে কোনও স্টাইলিং আইইয়ের সাথে আরও সমস্যাযুক্ত ... আমি এখনও অনুভব করি এটি সম্ভবত সবচেয়ে উপযুক্ত পদ্ধতির, আমি উপলক্ষে নিজের নিয়মগুলি ভঙ্গ করি না।
— ট্র্যাকার 1
তারপর ব্যবহার করবেন না <button>কিন্তু একটি input type=buttonপরিবর্তে?
— প্যাট্রিক অ্যাফেন্টেঞ্জার
4
তারপরে একটি <clickable>এলিমেন্ট ব্যবহার করুন । অথবা <clickabletim>আপনি যদি পছন্দ করেন তবে। দুর্ভাগ্যক্রমে, একটি মানহীন ট্যাগ বা একটি সরল ডিভি ব্যবহার করা কীবোর্ড ব্যবহারকারীদের জন্য উপাদানটির ফোকাস করা কঠিন করে তুলতে পারে।
— জোয়েটউইল
28
এই উত্তর উপরে হতে হবে। যদি আপনার এই দ্বিধা হয়, তবে সম্ভাবনা হ'ল আপনি আসলে একজনের প্রয়োজন button। এবং IE9 দ্রুত ভাগ্যক্রমে বাজারের শেয়ার হারাচ্ছে, এবং 1px সক্রিয় প্রভাব আমাদের সিমেটিক মার্কআপ ব্যবহার করতে বাধা দেওয়া উচিত নয়। <a>এটি একটি লিঙ্ক, এটি আমাদের কোনও ক্রিয়াকলাপের জন্য আপনাকে কোথাও প্রেরণ করা <button>।
— এমজসারফট্টি
141

ব্যবহারকারী জাভাস্ক্রিপ্ট অক্ষম থাকলে ক্ষেত্রে প্রথমে আসল লিঙ্কটি অনুসরণ করুন। জাভাস্ক্রিপ্ট কার্যকর হলে ক্লিক ইভেন্টটিকে গুলি চালানো থেকে বিরত রাখতে কেবল মিথ্যা প্রত্যাবর্তন নিশ্চিত করুন।

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

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

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

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

— বেল্টার
সূত্র
19
সুতরাং জাভাস্ক্রিপ্ট সহ ব্যবহারকারী এজেন্টগুলিতে সক্ষম হয়েছে এবং ফাংশনটি জাভাস্ক্রিপ্ট ফাংশনটিকে সমর্থন করে পিছনে পড়ে (ব্যবহারকারী এজেন্টদের জন্য যেখানে কোনও কারণেই জেএস ব্যর্থ হয়) পৃষ্ঠার শীর্ষের লিঙ্কটিতে? এটি খুব কমই একটি বুদ্ধিমান ফলব্যাক is
— কোয়ান্টিন
21
"ব্যবহারকারীর জাভাস্ক্রিপ্ট অক্ষম করা থাকলে আদর্শভাবে অনুসরণ করার জন্য একটি বাস্তব লিঙ্ক সহ", এটি একটি কার্যকর পৃষ্ঠাতে যাওয়া উচিত নয় #, এমনকি যদি এটি কেবল ব্যাখ্যা করে যে সাইটের কাজ করতে জেএস প্রয়োজন needs ব্যর্থতা হিসাবে, আমি বিকাশকারী মোতায়েনের আগে যথাযথ ব্রাউজার বৈশিষ্ট্য সনাক্তকরণ, ইত্যাদি ব্যবহার করার আশা করব।
— Zach
আমি ধরে নিব (আশা করি) এরকম কিছু কেবল পপআপ বা অনুরূপ সরল কিছু দেখানোর জন্য। সেক্ষেত্রে ডিফল্ট হ'ল পপআপ পৃষ্ঠা url। এটি যদি কোনও ওয়েব অ্যাপ্লিকেশনের অংশ হয় বা জেএস অক্ষম করা পৃষ্ঠাটি সম্পূর্ণরূপে ভেঙে দেয় তবে এই কোডে অন্যান্য সমস্যা রয়েছে ...
— ব্রায়ান মোস্কাও
5
আমার ওয়েব অ্যাপ্লিকেশনগুলি কৌতূহলজনকভাবে হ্রাস করার জন্য ডিজাইন করা হয়েছে, সুতরাং লিঙ্কটি এখনও একটি দরকারী পৃষ্ঠা হবে। আপনার ওয়েব অ্যাপ্লিকেশনটি কোনও চ্যাট ক্লায়েন্ট বা ইন্টারেক্টিভ কিছু নয় তবে আপনি অবক্ষয়ের কথা মাথায় রেখে ডিজাইনের জন্য সময় দিলে এটি কাজ করা উচিত।
— জাচ
2
সমস্যাটি হ'ল মাইজেএসফাঙ্ক যদি কোনও ত্রুটি ছুড়ে দেয় তবে এটি মিথ্যা ফেরতের জন্য ধরা পড়বে না।
— ট্র্যাকার 1
106

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

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

— ফিজ্টার
সূত্র
126
এই পদ্ধতিটি কেবলমাত্র একটি মাউস অপারেশনে 'লিঙ্ক' সীমাবদ্ধ করে। কোনও অ্যাঙ্করটি কীবোর্ডের মাধ্যমে দেখতে পাওয়া যায় এবং এন্টার কী টিপলে এর 'অনক্লিক' ইভেন্টটি বরখাস্ত করা হয়।
— অ্যান্থনিডব্লু জোন্স
40
আপনার সিএসএসের হার্ডকোডিং রঙগুলি ব্রাউজারটিকে কাস্টম রঙগুলি ব্যবহারকারী দ্বারা সংজ্ঞায়িত করা ব্যবহার থেকে বিরত রাখবে যা অ্যাক্সেসযোগ্যতার ক্ষেত্রে সমস্যা হতে পারে।
— হোসাম অলি
30
<span>গুলি কিছু করার বোঝায় না । <A>nchors এবং তার <buttons>জন্য ব্যবহৃত হয়!
— রেডশেডো
22
না ব্যবহার করার buttonsসময় এখানে ব্যবহার করা আরও ভাল পছন্দ span।
— Apnerve
1
আমি মনে করি অ্যাঙ্কর ট্যাগের চেয়ে স্প্যান ভাল। অ্যাঙ্কর ট্যাগটি আপনাকে এর বাধ্যতামূলক href বৈশিষ্ট্যে পরিচালিত করতে উপস্থিত রয়েছে। আপনি যদি href ব্যবহার করতে যাচ্ছেন না, অ্যাঙ্কর ব্যবহার করবেন না। এটি কেবল মাউসের লিঙ্ককে সীমাবদ্ধ করে না কারণ এটি কোনও লিঙ্ক নয়। এটি একটি href নেই। এটি আরও বেশি বোতামের মতো তবে এটি পোস্ট করে না। স্প্যান কিছু না বোঝানো হচ্ছে তা সম্পূর্ণ অবৈধ। ড্রপডাউন মেনুটি বিবেচনা করুন যা আপনি যখন ঘোরাবেন তখন সক্রিয় হয়। এটি সম্ভবত স্প্যান এবং ডিভসের সংমিশ্রণ, একটি বোতামের ক্রিয়াটি সম্পাদন করছে যা স্ক্রিনের একটি অঞ্চল প্রসারিত করে।
— নিবল্বিপিগ
97

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

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

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

— স্টিভ পাওলো
সূত্র
76

#ব্যবহারটি কিছু মজাদার আন্দোলন করে তোলে, তাই আমি #selfযদি আপনার টাইপিং প্রচেষ্টাগুলিতে সংরক্ষণ করতে চান তবে ব্যবহার করার পরামর্শ দেব JavaScript bla, bla,।

— স্প্যামার জো
সূত্র
7
বাহ, এই টিপসের জন্য থাম্বস আপ। কখনই জানতেন না যে আপনি #selfনামযুক্ত ট্যাগগুলির জন্য ব্যবহার করতে পারেন , এবং পৃষ্ঠার শীর্ষে ঝাঁপিয়ে পড়ার বিরক্তিকর ব্রাউজার আচরণটি এড়াতে পারেন। ধন্যবাদ.
— alonso.torres
34
রেফারেন্সের জন্য, #selfবিশেষ বলে মনে হচ্ছে না। যে কোনও খণ্ড সনাক্তকারী যা নথির কোনও উপাদানের নাম বা আইডির সাথে মেলে না (এবং ফাঁকা বা "শীর্ষ" নয়) একই প্রভাব থাকতে হবে।
— সিএইচও
1
আমি সাধারণত একটি তৈরি নোঙ্গর নাম ব্যবহার করি তবে আমি মনে করি যে আমার কাজটি চালিয়ে যাওয়ার জন্য এটি করা শুরু করব।
— ডগলাস.সেশার
11
আমি #voidঅন্য মন্তব্যে কনভেনশন প্রতিষ্ঠার পরামর্শ দিয়েছিলাম তবে আসলে #selfএটি সংক্ষিপ্ত এবং স্মরণে রাখা সহজ। ভাল কিছু চেয়ে#
— jakub.g
6
তবে আপনি যদি সেই লিঙ্কটি ক্লিক করেন তবে এটি ইউআরএলটিতে "# ভয়েড" দেখতে, নিজের মতো বা ত্রুটিযুক্ত বা বাগটি দেখতে নিজেরাই অদ্ভুত হবে।
— pmiranda
68

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

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

পরিবর্তে

<a href="javascript:void(0);" onclick="myJsFunc();">Link</a>
— se_pvel
সূত্র
2
আমি ব্যবহার করি javascript:(কোনও আধা-কোলন নেই) কারণ এটি হোভারের স্ট্যাটাস বারে পরিপাটি লাগে।
— বোয়ান
4
এই কোডটি পুরানো IE এ খারাপ বিস্ময়ের কারণ হতে পারে। কোনও সময়ে এটি চিত্রগুলি সহ রোলওভার এবং এমনকি অ্যানিমেটেড জিআইএফগুলি
— ইলিয়া
আপনি সর্বদা করতে পারেন ... javascript:void('Do foo')যেহেতু শূন্যতা নির্বিশেষে ফিরে আসবে না, এটি ক্লিক করে কী করবে তা ব্যবহারকারীকে একটি সূচক দেবে। আপনি যেখানে পছন্দ Do fooকরতে পারেন Delete record Xবা যা করতে পারেন।
— ট্র্যাকার 1
53

আমি অন্য কোথাও পরামর্শের সাথে একমত হয়েছি যে আপনাকে উল্লেখ করে নিয়মিত ইউআরএল ব্যবহার করা উচিত href, তারপরে অনক্লিকটিতে কিছু জাভাস্ক্রিপ্ট ফাংশন কল করুন। ত্রুটিটি হ'ল, তারা return falseকলটির পরে স্বয়ংক্রিয়ভাবে যুক্ত হয়।

এই পদ্ধতির সাথে সমস্যাটি হ'ল, যদি ফাংশনটি কাজ না করে বা কোনও সমস্যা হয় তবে লিঙ্কটি সঙ্কোচনীয় হয়ে উঠবে। অনক্লিক ইভেন্টটি সর্বদা ফিরে আসবে false, তাই সাধারণ ইউআরএল কল করা হবে না।

খুব সহজ সমাধান আছে। 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তাকে ডাকা হয়।

— Fczbkk
সূত্র
50

#এর চেয়ে ভাল javascript:anythingতবে নিম্নলিখিতটি আরও ভাল:

এইচটিএমএল:

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

javascript:

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

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

— জাস্টিন জনসন
সূত্র
1
@ মুহ্দ: ফিরতি clickলিঙ্কগুলিতে সক্রিয় হওয়া উচিত …
— রাই-
50

আমি <button>পরিবর্তে কোনও উপাদান ব্যবহার করার পরামর্শ দিচ্ছি , বিশেষত যদি নিয়ন্ত্রণে ডেটাতে কোনও পরিবর্তন আনার কথা। (পোষ্টের মতো কিছু।)

আপনি যদি উপাদানগুলি নিরবচ্ছিন্নভাবে ইনজেক্ট করেন তবে এটি আরও ভাল, এক ধরণের প্রগতিশীল বর্ধন। ( এই মন্তব্য দেখুন ।)

— আপনার মোডগুলি ভাল আচরণ করে
সূত্র
2
আমিও মনে করি এটিই সেরা সমাধান। যদি আপনার কাছে এমন কোনও উপাদান থাকে যা কোনও ক্রিয়া সম্পাদন করে বোঝানো হয়, তবে এটির কোনও লিঙ্ক হওয়ার কোনও কারণ নেই।
— mateuscb
আপনি যদি জিজ্ঞাসা করতেন এবং আপনার এই্রেফ দেখতে চাইলে "# কিছু" মনে হচ্ছিল অন্য কয়েকটি তালিকাভুক্ত উত্তরগুলি উপভোগ করতে পারে তবে: হেরেফ সংবেদনশীল কোনও কিছুর সাথে সংযুক্ত না হলে হ্রেফ বা সম্পূর্ণরূপে একটি লিঙ্ক রাখার কোনও অর্থ নেই। প্রস্তাবিত বোতামটি ব্যবহার করতে পারে বা অন্য যে কোনও উপাদান ব্যবহার করতে পারে তবে একটি লিঙ্কটি লিঙ্ককে কোথাও ধন্যবাদ জানায় না।
— কনটুর
1
এর আর একটি সুবিধা হ'ল বুটস্ট্র্যাপ .btnবোতাম এবং লিঙ্কগুলিকে হুবহু দেখতে দেয়।
— সিরো সান্তিলি 冠状 病毒 审查 六四 事件 法轮功
ব্যবহারকারীর দৃষ্টিকোণ থেকে, buttonইউআরএলতে একটি # প্রবেশ করায় না বা ahref কে জাভাস্ক্রিপ্ট হিসাবে দেখায় না :;
— কল
39

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

— সাইমন ফরেস্ট
সূত্র
36

অবশ্যই হ্যাশ ( #) ভাল কারণ জাভাস্ক্রিপ্টে এটি একটি সিউডোসেম:

  1. ইতিহাসকে দূষিত করে
  2. ইঞ্জিনের নতুন অনুলিপি ইনস্ট্যান্ট করে
  3. বিশ্বব্যাপী স্কোপে চলে এবং ইভেন্ট সিস্টেমকে সম্মান দেয় না।

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

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

— নিখরচায় পরামর্শ
সূত্র
1
@ বার্কার ইয়াসির, সিডব্লিউ কেন?
— নিখরচায় পরামর্শ
30

আমি সাধারণত যেতে

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

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

— dnetix
সূত্র
27

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

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

কারণ:

  1. এটি hrefসহজ, অনুসন্ধান ইঞ্জিনগুলির এটির প্রয়োজনীয় করে তোলে । আপনি যদি অন্য কিছু ব্যবহার করেন (যেমন একটি স্ট্রিং), এটি একটি 404 not foundত্রুটির কারণ হতে পারে ।
  2. যখন মাউস লিঙ্কটির উপরে ঘোরাফেরা করে, এটি কোনও স্ক্রিপ্ট হিসাবে দেখায় না।
  3. ব্যবহার করে return false;, পৃষ্ঠাটি উপরে উঠে যাবে বা backবোতামটি ভাঙ্গবে না ।
— এরিক ইয়িন
সূত্র
আমি "১" এর সাথে একমত নই যখন আপনি স্ক্রিপ্টগুলি অনুমোদিত না হয় আপনি যখন স্ক্রিপ্ট লিঙ্কটি রাখেন তখন এটি ত্রুটি দেয় gives যাতে সেই জাতীয় লিঙ্কগুলি জেএস কোডের সাথে যুক্ত করা উচিত। স্ক্রিপ্ট অনুমোদিত না থাকায় লোকেরা সেই লিঙ্কগুলি এড়াতে পারে এবং কোনও ত্রুটি দেখতে পাবে না।
— বার্কার ইয়াসিয়ার
25

আমি ব্যবহারটি বেছে নিই javascript:void(0), কারণ এটি ব্যবহার করে সামগ্রী মেনু খুলতে ডান ক্লিকটি প্রতিরোধ করা যেতে পারে। তবে javascript:;সংক্ষিপ্ত এবং একই জিনিস করে।

— 564706
সূত্র
24

সুতরাং, আপনি যখন কোনও জাভাস্ক্রিপ্টের কোনও জিনিস কোনও <a />ট্যাগ দিয়ে করছেন এবং আপনি যদি এটির কথা href="#"রাখেন, আপনি ইভেন্টের শেষে (ইনলাইন ইভেন্ট বাঁধার ক্ষেত্রে) রিটার্ন মিথ্যা যুক্ত করতে পারেন:

<a href="#" onclick="myJsFunc(); return false;">Run JavaScript Code</a>

অথবা আপনি জাভাস্ক্রিপ্ট এর সাথে href বৈশিষ্ট্য পরিবর্তন করতে পারেন:

<a href="javascript://" onclick="myJsFunc();">Run JavaScript Code</a>

অথবা

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

কিন্তু শব্দার্থকভাবে, এটি অর্জনের উপরের সমস্ত উপায়গুলি ভুল (এটি যদিও ঠিক কাজ করে) । পৃষ্ঠাটি নেভিগেট করার জন্য যদি কোনও উপাদান তৈরি করা হয় না এবং এর সাথে কিছু জাভাস্ক্রিপ্ট জিনিস যুক্ত রয়েছে, তবে এটি <a>ট্যাগ হওয়া উচিত নয় ।

আপনি <button />খালি জিনিস বা অন্য যে কোনও উপাদান যেমন বি, স্প্যান বা আপনার প্রয়োজন অনুযায়ী যা কিছু ফিট করে তা করতে কেবল তার পরিবর্তে ব্যবহার করতে পারেন কারণ আপনাকে সমস্ত উপাদানগুলিতে ইভেন্ট যুক্ত করার অনুমতি দেওয়া হয়েছে।

সুতরাং, ব্যবহার করার একটি সুবিধা রয়েছে<a href="#"> । আপনি যখন করবেন তখন সেই উপাদানটিতে ডিফল্টরূপে আপনি কার্সার পয়েন্টার পাবেন a href="#"। তার জন্য, আমি মনে করি আপনি এটির জন্য সিএসএস ব্যবহার করতে পারেন cursor:pointer;যা এই সমস্যাটিকেও সমাধান করে।

এবং শেষে, আপনি নিজেই জাভাস্ক্রিপ্ট কোড থেকে ইভেন্টটিকে আবদ্ধ করছেন, আপনি event.preventDefault()যদি <a>ট্যাগ ব্যবহার করে থাকেন তবে এটি অর্জন করতে আপনি করতে পারেন , তবে আপনি যদি <a>এই জন্য ট্যাগ ব্যবহার না করে থাকেন তবে সেখানে একটি সুবিধা পাবেন, আপনি ডন ' এটি করার দরকার নেই।

সুতরাং, যদি আপনি দেখতে পান তবে এই ধরণের স্টাফের জন্য ট্যাগ না ব্যবহার করা ভাল।

— আশীষ কুমার
সূত্র
23

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

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

পরিবর্তে, লিঙ্ক ব্যতীত অন্য কোনও উপাদান ব্যবহার করুন:

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

এবং এটি CSS এর সাথে স্টাইল করুন:

.funcActuator { 
  cursor: default;
}

.funcActuator:hover { 
  color: #900;
}
— গ্যারেট
সূত্র
13
স্প্যান নয়, একটি বোতাম ব্যবহার করুন। বোতামগুলি স্বাভাবিকভাবে ফোকাস ক্রমে পড়ে তাই মাউস / ট্র্যাকপ্যাড / ইত্যাদি ছাড়াই অ্যাক্সেস করা যায়
— কোয়ান্টিন
4
টন কুইন্টিনের মন্তব্য যুক্ত করা: বর্তমানে লেখা হিসাবে কীবোর্ড ব্যবহারকারীরা spanউপাদানটিতে পৌঁছাতে পারবেন না কারণ এটি একটি মনোনিবেশযোগ্য উপাদান। এজন্য আপনার একটি বোতাম দরকার।
— Tsundoku
1
স্প্যানটিতে যোগ করে tabindex="0"আপনি এটি মনোনিবেশযোগ্য করতে পারেন । এটি বলেছিল, বোতামটি ব্যবহার করা আরও ভাল কারণ এটি আপনাকে বিনামূল্যে পছন্দসই কার্যকারিতা দেয়। স্প্যান ব্যবহার করে এটিকে অ্যাক্সেসযোগ্য করে তুলতে আপনাকে কেবল একটি ক্লিক হ্যান্ডলার সংযুক্ত করতে হবে না, তবে একটি কীবোর্ড ইভেন্ট হ্যান্ডলার যা স্পেস বারের প্রেসগুলি সন্ধান করে বা কী প্রবেশ করায় এবং তারপরে সাধারণ ক্লিকের হ্যান্ডলারে গুলি চালায়। আপনি দ্বিতীয় সিএসএস সিলেক্টরকেও পরিবর্তন করতে চান .funcActuator:hover, .funcActuator:focusযাতে উপাদানটির ফোকাস রয়েছে তা প্রকট।
— অকেজো কোড
22

JQuery ব্যবহার করা আরও ভাল হবে,

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

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

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

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

যথেষ্ট সরল!

— en
সূত্র
5
এই আমি বলতে যাচ্ছিলাম। যদি কোনও লিঙ্কটির কোনও ফ্যালব্যাক url থাকে যা বোঝায় তবে তা ব্যবহার করুন। অন্যথায়, কেবল href বাদ দিন বা <a> এর চেয়ে শব্দার্থগতভাবে উপযুক্ত কিছু ব্যবহার করুন। সবাই যদি হেরেফকে সমর্থন করার একমাত্র কারণ হ'র আঙ্গুলটি পেতে থাকে তবে একটি সহজ "ক or কার্সার: পয়েন্টার;।" কৌতুকটি করবে।
— ম্যাট ক্যান্টর
12
এটি ভয়ানক অ্যাক্সেসযোগ্যতা দেয়। এটি চেষ্টা করে দেখুন: আপনি মাউস ব্যবহার না করে কোনও পোস্ট ফ্ল্যাগ করতে পারবেন না। "লিঙ্ক" এবং "সম্পাদনা" লিঙ্কগুলি ট্যাবিংয়ের মাধ্যমে অ্যাক্সেসযোগ্য তবে "পতাকা" তা নয়।
— নিকোলস
6
আমি এই বিকল্পের সাথে একমত যদি অ্যাঙ্কারের জাভাস্ক্রিপ্ট ব্যতীত অন্য কোনও উদ্দেশ্য না থাকে তবে এটির একটি href থাকা উচিত নয়। @ ফাতিঃ jQuery ব্যবহার করার অর্থ জাভাস্ক্রিপ্ট অক্ষম থাকলে লিঙ্কটিতে কোনও পয়েন্টার থাকবে না।
— স্কট রিপ্পি
3
আপনি যদি এই রুটে যেতে যাচ্ছেন, তবে jQuery ব্যবহার করে ক্লিকটিকে কেন আবদ্ধ করবেন না? JQuery ব্যবহার সম্পর্কে দুর্দান্ত জিনিসটির অংশটি হ'ল আপনার মার্কআপ থেকে আপনার জাভাস্ক্রিপ্ট আলাদা করার ক্ষমতা।
— মুহিত
4
আমি বিশ্বাস করতে পারি না এই উত্তরের 11 টি ভোট রয়েছে। এটা ভয়ানক. আপনি জাভাস্ক্রিপ্ট (এবং jQuery ??) এর মাধ্যমে কেন একটি শৈলী যুক্ত করছেন এবং তারপরে এইচটিএমএলে আপনার অন্লিক ক্রিয়াটি সংজ্ঞায়িত করছেন? ভয়ানক.
— এমএমএম
20

আপনি যদি AngularJS ব্যবহার করছেন বলে মনে হয় তবে আপনি নিম্নলিখিতগুলি ব্যবহার করতে পারেন:

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

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

এছাড়াও

  • এটি (#) এর মতো আপনাকে পৃষ্ঠার শীর্ষে তুলবে না
    • অতএব, আপনার স্পষ্টভাবে falseজাভাস্ক্রিপ্ট দিয়ে ফিরে আসতে হবে না
  • এটি সংক্ষিপ্ত সংক্ষিপ্ত
— ঘূর্ণি
সূত্র
6
তবে এর ফলে পৃষ্ঠাটি পুনরায় লোড হতে পারে এবং যেহেতু আমরা পৃষ্ঠাটি সংশোধন করতে সর্বদা জাভাস্ক্রিপ্ট ব্যবহার করি, এটি গ্রহণযোগ্য নয়।
— হেনরি হু
@ হেনরিহু আমি বুঝতে পেরেছিলাম যে এটি পুনরায় লোড না করার কারণ অ্যাঙ্গুলারজেএস of আমার আপডেট হওয়া উত্তরটি দেখুন।
— ঘূর্ণি
19

যদি না hrefথাকে তবে অ্যাঙ্কর ট্যাগ ব্যবহার করার কোনও কারণ নেই।

আপনি প্রায় প্রতিটি উপাদানগুলিতে ইভেন্টগুলি (ক্লিক, হোভার ইত্যাদি) সংযুক্ত করতে পারেন, তবে কেন কেবল একটি spanবা একটি ব্যবহার করবেন না div?

এবং JavaScript ব্যবহারকারীদের জন্য অক্ষম করা হয়েছে: যদি একটি ফলব্যাক (উদাহরণস্বরূপ, একটি বিকল্প নয় href), তারা অন্তত এ সব যে উপাদান, যাহা এটা একটি সঙ্গে দেখার জন্য এবং ইন্টারঅ্যাক্ট সক্ষম হবে না <a>বা <span>ট্যাগ।

— আছাইরপার্ট
সূত্র
19

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

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

<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যখন জাভাস্ক্রিপ্ট সহ আপনার দর্শকরা আপনার বর্ধিত কার্যকারিতা দেখেন তখন তাদের দিকে পরিচালিত করা হয়।

— অ্যান্ড্রু মুর
সূত্র
17

আমি ব্যক্তিগতভাবে তাদের সংমিশ্রণে ব্যবহার করি। উদাহরণ স্বরূপ:

এইচটিএমএল

<a href="#">Link</a>

jQuery সামান্য বিট সঙ্গে

$('a[href="#"]').attr('href','javascript:void(0);');

অথবা

$('a[href="#"]').click(function(e) {
   e.preventDefault();
});

ব্যবহারকারী কেবল খালি নোঙ্গর এ ক্লিক করলে কেবল পৃষ্ঠে শীর্ষে উঠে আসা রোধ করার জন্য আমি এটি ব্যবহার করছি। আমি খুব কমই onসরাসরি এইচটিএমএলে অনক্লিক এবং অন্যান্য ইভেন্টগুলি ব্যবহার করছি ।

আমার পরামর্শটি হ'ল অ্যাঙ্করের পরিবর্তে বৈশিষ্ট্যযুক্ত <span>উপাদানটি ব্যবহার করা class। উদাহরণ স্বরূপ:

<span class="link">Link</span>

তারপরে .linkশরীরে মোড়ানো স্ক্রিপ্ট সহ এবং </body>ট্যাগের ঠিক আগে বা কোনও বাহ্যিক জাভাস্ক্রিপ্ট নথিতে ফাংশনটি বরাদ্দ করুন ।

<script>
    (function($) {
        $('.link').click(function() {
            // do something
        });
    })(jQuery);
</script>

* দ্রষ্টব্য: গতিশীলভাবে তৈরি উপাদানগুলির জন্য, ব্যবহার করুন:

$('.link').on('click', function() {
    // do something
});

এবং গতিশীলভাবে তৈরি উপাদানগুলির জন্য যা গতিশীলভাবে তৈরি উপাদানগুলির সাথে তৈরি হয়, ব্যবহার করুন:

$(document).on('click','.link', function() {
    // do something
});

তারপরে আপনি সামান্য সিএসএস সহ অ্যাঙ্কারের মতো দেখতে স্প্যান উপাদানকে স্টাইল করতে পারেন:

.link {
    color: #0000ee;
    text-decoration: underline;
    cursor: pointer;
}
.link:active {
    color: red;
}

উপরে বর্ণিত উপরে jsFizz উদাহরণ এখানে ।

— এমডেসেভ
সূত্র
16

আপনি কী অর্জন করতে চান তার উপর নির্ভর করে আপনি অনক্লিকটি ভুলে গিয়ে কেবল href ব্যবহার করতে পারেন:

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

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

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

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

— পড়বেন
সূত্র
3
এর একমাত্র ক্ষতি (স্মৃতি থেকে, আমি ভুল হতে পারি) হ'ল আইই কোনও এটিকে একটি হিসাবে বিবেচনা করে না যদি আপনার এর ভিতরে কোনও হেরেফ না থাকে। (সুতরাং সিএসএসের বিধিগুলি কার্যকর হবে না)
— বেনজল
16

যখন আমি বেশ কয়েকটি ফ্যাক্স-লিঙ্ক পেয়েছি তখন আমি তাদেরকে 'নো-লিঙ্ক' শ্রেণি দিতে পছন্দ করি।

তারপরে 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>

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

— স্ট্যাকগুলিতে স্ট্যাকগুলিতে
সূত্র
16

আমি বিশ্বাস করি আপনি একটি ভ্রান্ত দ্বৈতত্ত্ব উপস্থাপন করছেন। এগুলি কেবল দুটি বিকল্প নয়।

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

— চতুর মানব
সূত্র
এছাড়াও যদি আপনি একটি এর aসাথে প্রতিস্থাপন করতে চান তবে আপনাকে spanএটি কীবোর্ডের মাধ্যমে ফোকাসযোগ্য করে তুলতে হবে remember
— ফিশার
16

আমি বিকাশকারী সরঞ্জামগুলির সাহায্যে গুগল ক্রোমে উভয় চেষ্টা করেছি এবং এটি id="#"0.32 সেকেন্ড সময় নিয়েছে। যদিও javascript:void(0)পদ্ধতিটি কেবল 0.18 সেকেন্ডে সম্পন্ন হয়েছে। গুগল ক্রোমে তাই javascript:void(0)আরও ভাল এবং দ্রুত কাজ করে।

— রিভস , 2 ব্যবহারকারী 67% ব্যবহারকারী 6460587
সূত্র
আসলে তারা একই কাজ করে না। # আপনাকে পৃষ্ঠার শীর্ষে লাফিয়ে তোলে।
— জোচেন
13

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

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

এখানে একটি নমুনা। হোম / চেঞ্জপিকচারটি ইউজার ইন্টারফেস এবং স্ট্যান্ডার্ড এইচটিএমএল সাবমিট বোতামগুলির সাথে সম্পূর্ণ পৃষ্ঠায় একটি ফর্মের একটি কার্যকারী লিঙ্ক, তবে এটি 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>
— জোশ সিমারম্যান
সূত্র
এসইও এর মেয়াদে আমি এইভাবে পছন্দ করব। যতটা বন্ধুত্বপূর্ণ ইউআরএল ব্যবহার করা নিশ্চিতভাবে পৃষ্ঠার মান ফ্যাক্টরটিকে উন্নত করে।
— চিতাবাহন
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.