এইচটিএমএল অ্যাঙ্কর লিঙ্ক - href এবং অন্লিক উভয়?


93

আমি এমন একটি অ্যাঙ্কর ট্যাগ লেখতে চাই যা কিছু জাভাস্ক্রিপ্ট কার্যকর করে এবং তারপরে যেখানেই যাচ্ছিল সেখানে যেতে hrefহবে। আমার জাভাস্ক্রিপ্ট কার্যকর করে এবং তারপরে সেট করে window.locationবা লোকেশনটিতে কোনও ফাংশন চালু করা আমার top.locationপক্ষে hrefকাজ করে না।

সুতরাং, কল্পনা করুন যে পৃষ্ঠাতে আইডি "ফু" দিয়ে আমার একটি উপাদান রয়েছে। আমি অনুরূপ একটি অ্যাঙ্কর লিখতে চাই:

<a href="#Foo" onclick="runMyFunction(); return false;">Do it!</a>

যখন এটি ক্লিক করা হয়, আমি রানমিফাইঙ্কশনটি সম্পাদন করতে চাই এবং তারপরে পৃষ্ঠাটিতে ঝাঁপিয়ে পড়ি #Foo(পুনরায় লোডের কারণ না করে - top.locationপৃষ্ঠাটি পুনরায় লোডের কারণ হয়)।

পরামর্শ? আমি এখানে jQuery ব্যবহার করতে পারলে খুশি!


return true;সমাধান, কিন্তু আপনি কল করতে পারেন location.hash = '#Foo'। এটি পৃষ্ঠাটি পুনরায় লোড করবে না।
shuangwhywhy

উত্তর:


135

শুধু return trueপরিবর্তে?

onClickকোড থেকে রিটার্নের মানটি নির্ধারণ করে যে লিঙ্কটির অন্তর্নিহিত ক্লিকের ক্রিয়া প্রক্রিয়াজাত করা হয়েছে কিনা - প্রত্যাবর্তনের falseঅর্থ এটি প্রক্রিয়াজাত করা হয়নি, তবে আপনি যদি ফিরে যান trueতবে ব্রাউজারটি আপনার ক্রিয়াকলাপটি ফিরে আসার পরে এটি প্রক্রিয়া করতে এবং যথাযথটিতে যাবে নোঙ্গর


4
অনক্লিক কিছু না ফেরলে কী হবে?
maciek

4
@ ম্যাসিক এর পরে রিটার্নের মান হিসাবে বিবেচিত হবে undefinedযা এই উদ্দেশ্যে মিথ্যা বলে বিবেচিত হবে।
অ্যাম্বার

4
অতীতে যখনই আমি একটি নতুন পৃষ্ঠা চালু করার জন্য একটি জেএস ফাংশন ব্যবহার করতাম এবং href বৈশিষ্ট্যের জন্য মাত্র একটি "#" রাখতাম, আমি ডিফল্ট ক্রিয়াটি রোধ করতে "-1" ফিরে আসতাম, যা সাধারণত ব্রাউজারটি ঝাঁপিয়ে পড়ে is টট তিনি পৃষ্ঠার শীর্ষে, বা কখনও কখনও আমি কিছুই ফেরত না। ইদানীং @ অ্যাম্বারের পরামর্শ অনুসারে আমাকে এই সমস্ত পৃষ্ঠাটি সংশোধন করতে হবে ... বিশেষত মিথ্যা প্রত্যাবর্তনের জন্য, যদি আমি পৃষ্ঠাটি লাফাতে না চাই।
রেন্ডি

4
@ অ্যাম্বার মনে হয় যদি অনক্লিক কিছু না ফেরায় তবে লিঙ্কটির অন্তর্নিহিত ক্লিকের ক্রিয়াটি প্রক্রিয়া করা হবে।
iplus26

এছাড়াও ক্লিক ইভেন্ট হ্যান্ডলারে আপনি ইভেন্ট.প্রিভেন্টডিফল্ট () ব্যবহার করবেন না।
রুবেন 18

36
<a href="#Foo" onclick="return runMyFunction();">Do it!</a>

এবং

function runMyFunction() {
  //code
  return true;
}

এইভাবে আপনি আপনার কার্য সম্পাদন করবেন এবং আপনি লিঙ্কটি অনুসরণ করবেন এবং আপনার ফাংশনটি সফলভাবে সঞ্চালনের ঠিক পরে লিঙ্কটি অনুসরণ করবেন।


4
আপনার ফাংশনটি পিছিয়ে ফাংশন কলের পরে যদি সত্য হয়ে যায় তবে কি কাজ করছে বলে মনে হচ্ছে না?
ডেভিডভিডিডি

7

যদি ফাংশনটি সফল হয় তবে যদি লিঙ্কটি কেবলমাত্র স্থানটি পরিবর্তন করে, তবে করুন onclick="return runMyFunction();"এবং ফাংশনে আপনি সত্য বা মিথ্যা ফিরে আসবেন।

আপনি যদি কেবলমাত্র ফাংশনটি চালাতে চান এবং তারপরে অ্যাঙ্কর ট্যাগটিকে তার কাজটি করতে দিন, কেবল return falseবিবৃতিটি সরিয়ে দিন ।

পার্শ্ব নোট হিসাবে, সম্ভবত আপনার পরিবর্তে কোনও ইভেন্ট হ্যান্ডলার ব্যবহার করা উচিত, কারণ ইনলাইন জেএস কোনও কাজ করার খুব অনুকূল উপায় নয়।


0

ক্লিন এইচটিএমএল স্ট্রাকচার করার সময় আপনি এটি ব্যবহার করতে পারেন।

//Jquery Code
$('a#link_1').click(function(e){
  e . preventDefault () ;
  var a = e . target ;
  window . open ( '_top' , a . getAttribute ('href') ) ;
});

//Normal Code
element = document . getElementById ( 'link_1' ) ;
element . onClick = function (e) {
  e . preventDefault () ;
  
  window . open ( '_top' , element . getAttribute ('href') ) ;
} ;
<a href="#Foo" id="link_1">Do it!</a>

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