একটি HTML লিঙ্ক করুন যা কিছুই করে না (আক্ষরিক কিছুই নয়)


87

আমি এমন লিঙ্ক চাই যা কিছু না করে। আমি এটি চাই না:

<a href="#">

কারণ তখন ইউআরএল হয়ে যায় something.com/whatever/#

আমি লিংকটি চাওয়ার একমাত্র কারণ তাই ব্যবহারকারী দেখতে পাচ্ছেন যে তারা পাঠ্যে ক্লিক করতে পারেন। জাভাস্ক্রিপ্ট কিছু ক্রিয়া সম্পাদনের জন্য ব্যবহৃত হচ্ছে যাতে আমার কোথাও যাওয়ার লিঙ্কটির প্রয়োজন নেই তবে আমার লিঙ্কটির মতো দেখতে এটির প্রয়োজন!

আমি কিছু ডেটা অ্যাট্রিবিউট ব্যবহার করতে এবং উপাদানগুলিকে লিঙ্কগুলির মতো দেখতে তৈরি করতে আমাকে সিএসএস বলতে পারতাম যদি তাদের এ বৈশিষ্ট্যটি থাকে তবে এটি কিছুটা ওভারকিল বলে মনে হয়।


এর সাথে কী হয়েছে something.com/whatever/#?
চার্লস স্প্রেবেরি

4
আপনি এটিকে একটি ফাঁকা ফাঁকা দিতে এবং জাভাস্ক্রিপ্টে মিথ্যা ফিরতে পারেন। কিন্তু এটি আরো শব্দার্থিক যদি আপনি শুধু কার্সার সম্পত্তি পরিবর্তন pointerআপনার CSS এ
JohnP

@ চার্লসস্প্রেবি: এমন পরিস্থিতি রয়েছে যা আপনি এটি চান না।
PeeHaa

Ux.stackexchange.com এও জিজ্ঞাসা করা ভাল প্রশ্ন হবে ।

4
: এই প্রশ্নের আরো গভীরতা এখানে আলোচনা করা হয় stackoverflow.com/questions/134845/...
DawnPaladin

উত্তর:


125

নিম্নলিখিত আপনার href চালানো থেকে রোধ করবে

<a href="#" onclick="return false;">

আপনি jQuery ব্যবহার করা হয়, ব্যবহার করা event.preventDefault()যেতে পারে


অতিরিক্ত অনক্লিক ইভেন্টগুলি বাতিল হওয়ার কারণ দেয়।
রাউলি রাজান্ডে

6
পৃষ্ঠায় শীর্ষে স্ক্রোল করার কারণ ঘটায়।
ডেভিড হেম্পি

@ ডেভিডহেম্পি আমি এটি অনুভব করি না। কোন ব্রাউজার?
কর্ট

4
@ কার্ট গুগল ক্রোম সংস্করণ .0৩.০.৩৩৩৯.৮৮ (অফিসিয়াল বিল্ড) (-৪-বিট) (অথবা সম্ভবত দু'বছর আগে কিছুটা পুরানো সংস্করণ)
ডেভিড হ্যাম্পি

এটি আইডি এবং লিঙ্কে ওয়ার্ডপ্রেস প্লাগইন স্ক্রোলের জন্য কাজ করে না তবে কিছু করবে। এই ক্ষেত্রে, এটি বাগি জিনিস হবে যা আপনাকে পৃষ্ঠার শীর্ষে পুনর্নির্দেশ করবে।
জিরি অটোপাল イ り オ ト ウ パ

89

এটা চেষ্টা কর:

<a href="javascript:void(0);">link</a>

4
+1 তবে দ্রুত প্রশ্ন: javascript:voidএবং এর মধ্যে পার্থক্য রয়েছে javascript:void(0)কি?
অ্যাডাম রাকিস

4
আপনি যদি জাভাস্ক্রিপ্ট ব্যবহার করার চেষ্টা করবেন: প্যারাম ছাড়াই অকার্যকর (0) আপনার সিনট্যাক্সেরর হবে এবং আপনার সমস্ত স্ক্রিপ্টগুলি ব্যর্থ হবে।
অ্যালেক্সেটস

4
@ অ্যালেক্সদেটগুলি সিনট্যাক্স এরির javascript:void()হবে তবে javascript:voidকেবল অপরিবর্তিত - একইরূপে প্রদান করবে void(0)। অ্যাডাম, যতদূর আমি বলতে পারি, voidএবং void(0)এই ব্যবহারের জন্য কার্যত সমতুল্য। --- সম্পাদনা করুন: যদিও আমি অন্যান্য মন্তব্যগুলি দেখছি যা ইঙ্গিত দেয় যে এটি পৃষ্ঠাটি পুনরায় লোড করতে পারে ..
andytuba

4
আপনি কীভাবে জাভাস্ক্রিপ্ট / জাভাস্ক্রিপ্ট / জাভাস্ক্রিপ্ট / জাভাস্ক্রিপ্টকে মূলধন করেন তা বিবেচনা করে না?
টিম ট্রাস্টন

4
@ টেকটিটিমো না মূলধন কোনও বিষয় নয়, বাস্তবে এটি মূলধন হওয়া উচিত নয়। আমি একটি সম্পাদনা জমা দিয়েছেন।
ওয়েস্টন গাঙ্গার

28

এইচটিএমএল 5 এ এটি খুব সাধারণ। কেবল hrefগুণটি বাদ দিন ।

<a>Do Nothing</a>

এমডিএন থেকে একটি ট্যাগ href বৈশিষ্ট্যে :

href

হাইপারটেক্সট উত্স লিঙ্কটি সংজ্ঞায়িত অ্যাঙ্করগুলির জন্য এটি একক প্রয়োজনীয় বৈশিষ্ট্য ছিল, তবে এইচটিএমএল 5 এ আর প্রয়োজন হয় না।


হোভারে হাত কার্সার সম্পর্কে কী?

একটি ব্রাউজার ডিফল্ট শৈলী, একটি পয়েন্টার কার্সার পরিবর্তন নাও হতে পারে জন্য aসঙ্গে ট্যাগ href। আপনি নিম্নলিখিত CSS এর মাধ্যমে সর্বজনীনভাবে এটি পরিবর্তন করতে পারেন।

a {
    cursor: pointer;
}
<a>Do Nothing</a>

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


এটিকে ট্যাব-ফোকাসযোগ্য করার বিষয়ে কী?

শুধু tabindex="0"উপাদান যোগ করুন ।

<a tabindex="0">Do Nothing</a>


aকোনও লিঙ্ক ছাড়াই ট্যাগ ব্যবহার করা কি বোধগম্য ?

সাধারণত না, buttonপরিবর্তে কোনও উপাদান ব্যবহার করা আরও ভাল , এবং এটি সিএসএস দিয়ে স্টাইল করুন। তবে আপনি যা কিছু ব্যবহার করুন না কেন divসম্ভব হিসাবে একটি স্বেচ্ছাসেবী উপাদান ব্যবহার এড়ান , কারণ এটি মোটেও শব্দার্থক নয়।


4
বুটস্ট্র্যাপ 4 দিয়ে, যে লিঙ্কগুলিতে হ্রেফ নেই তারা লিঙ্ক হিসাবে স্টাইলযুক্ত হয় না।
ব্যবহারকারী 3413723

13

এটিকে কোনও লিঙ্ক তৈরি করবেন না (যদিও এটি করার পক্ষে এটি অগ্রাধিকারযুক্ত) এবং এটি CSS এর সাথে স্টাইল করুন যাতে এটি কোনও লিঙ্কের মতো দেখাচ্ছে:

p.not-a-link { text-decoration: underline; cursor: pointer } 

বা আরও ভাল এটি একটি লিঙ্ক করুন এবং e.preventDefault()লিঙ্ক প্রতিরোধ করতে ব্যবহৃত জাভাস্ক্রিপ্ট ফাংশন যাক ।

এছাড়াও লিঙ্কটি যুক্ত করুন hrefযাতে জেএস সক্ষম না করে ব্যবহারকারীরা এখনও এটি ব্যবহার করতে সক্ষম হবে (ফ্যালব্যাক হিসাবে)।


4
+1 আই 5.5 বিতর্ক শেষ হওয়ার সাথে সাথে, স্প্যান কি এপি-র চেয়ে ভাল হবে?
অমলভিন

4
আমি স্প্যান পছন্দ করি পি একটি নতুন সারি তৈরি করতে পারে, যখন স্প্যানটি করতে পারে না
রনি ওস্টিং

9

<a href="javascript:;">Link text</a> - আমি সাধারণত এটি ব্যবহার করি


4
এটি কি কিছু ব্রাউজার দিয়ে পৃষ্ঠাটি পুনরায় লোড করবে না?
কর্ট

@ কার্ট: আপনি ঠিক আছেন, প্রশ্নটি ভুলভাবে পড়ুন। আপনি এর থেকে একটি মন্তব্য পেয়ে গেছেন :-)
স্কট ব্রাউন

... এবং আমি এডিট করার পরে একটি সহ 2 টি ডাউনওয়েট পেয়েছি! হর্ষ!
স্কট ব্রাউন

প্রথম কোডটি সরান, তারপরে আমাকে আমার ডাউন ভোট সরিয়ে নেওয়ার অনুমতি দেওয়া হবে :) এটি আমাকে ডাউনভোটটি, তার "লক করা" সরাতে দেবে না
কর্ট

4
এটি কোন ব্রাউজারগুলিকে প্রভাবিত করে, এটি এখনও কোনও সমস্যা? এটির চেয়ে বেশি পছন্দ করা হবে void(0), কারণ এটি স্ট্যাটাস বারে প্রকাশিত হয়েছে। আমি বলছি যেহেতু আমি ব্যবহারকারীরা এটিকে একটি বাগ / ত্রুটি হিসাবে চিহ্নিত করেছেন (যা এটি স্পষ্টতই নয়), তাই আমি মনে করি এটি টি তাদের কাছে বিভ্রান্ত করছে।
অংশ_স্প্লিট

4

আমরা অর্জন করতে পারি যে জাভাস্ক্রিপ্ট অকার্যকর ব্যবহার করে যা সাধারণত একটি অভিব্যক্তি মূল্যায়নের সাথে জড়িত থাকে এবং অপরিবর্তিত থাকে, যার মধ্যে javascript:void(0);href যুক্ত থাকে।

অকার্যকর অপারেটরটি সাধারণত একটি অপরিজ্ঞাত আদিম মান অর্জন করতে ব্যবহৃত হয় সাধারণত "অকার্যকর (0)" (যা "শূন্য 0" এর সমান) ব্যবহার করে। এই ক্ষেত্রে, বিশ্বব্যাপী পরিবর্তনশীল অপরিবর্তিত পরিবর্তে ব্যবহার করা যেতে পারে (ধরে নিলে এটি একটি ডিফল্ট মান হিসাবে নির্ধারিত হয়নি)।

a {
  text-decoration: initial;
}
<a href="javascript:void(0);"> This link actually does nothing when clicked</a>


2

@ কর্টের উত্তরটি কার্যকর হবে তবে আপনি কোনও বোগাস লিঙ্ক উত্সাহিত না করে এটি কোনও লিঙ্কের মতো দেখতে সিএসএসে কার্সার স্টাইল ব্যবহার করতে পারেন । ব্রাউজার কনফারেন্সের উপর নির্ভর করে হাত বা পয়েন্টার ব্যবহার করুন।

ক্রস ব্রাউজার কনফরম্যান্ট পয়েন্টার সিএসএস ( কার্সার স্টাইল গাইড থেকে):

element {
    cursor: pointer;
    cursor: hand;
}

@ পেহাহা কেবলমাত্র পয়েন্টার ব্যবহার করুন যদি আপনি এটি আই 5.5 এবং এর আগে কাজ করতে না চান!
আমেলভিন

4
ঠিক এটাই আমি বলেছিলাম! দয়া করে আই 5.5 উল্লেখ করবেন না: পি আরও গুরুতর নোটে আই 5.5 শেয়ারটি 0.17%। লোকেরা এখনও যদি সেই সংস্করণে থাকে তবে তারা ওয়েব ব্রাউজ করার যোগ্য নয়
PeeHaa

2

কোনও উপায় যা উল্লেখ করেনি তা হ'ল href এর মতো একটি খালি লোকাল ফাইলের দিকে নির্দেশ করা

<a href='\\'>my dead link</a>

কেন? আপনি যদি প্রতিক্রিয়া বা কৌণিকের মতো কোনও কাঠামো ব্যবহার করেন তবে সংকলকটি কিছু সতর্কতা ছড়িয়ে দেবে যা আপনার লগ বা কনসোলকে নোংরা করে তুলতে পারে। এই কৌশলটি রোবট বা মাকড়সাগুলিকে ভুলভাবে লিঙ্ক করা থেকে বিরত করবে।


-1

ব্যবহার করবেন না <a>... পরিবর্তে ব্যবহার করুন <span class='style-like-link'> এবং তারপরে আপনি চান তবে স্টাইল করতে ক্লাসটি ব্যবহার করুন।


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

রাজি। এটি সম্পূর্ণরূপে ব্যবহারের ক্ষেত্রে এবং আপনি কী সম্পাদনের চেষ্টা করছেন তার উপর নির্ভর করে। আমি কেবল এটিই এএন বিকল্প হিসাবে অন্যদের জানতে সাহায্য করার জন্য একটি উত্তর হিসাবে সরবরাহ করেছি।
ব্রাইস

যদি এটি হয় তবে আমি এটির ভাষা অনুবাদ করতে এডিট করার পরামর্শ দেব যা এটি একটি সম্ভাব্য বিকল্প দেখায়, ক্যাপগুলিতে স্ট্যান্ডার্ড অ্যাঙ্কর ট্যাগটি ব্যবহার না করার পরিবর্তে বলার চেয়ে, যখন এটি করা পুরোপুরি বৈধ
টিম
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.