ব্রাউজারের পিছনের বোতামটি ব্যবহার করার সময় কীভাবে কোনও পৃষ্ঠা পুনরায় লোড করার জন্য?

Question

আমাকে একরকম সনাক্ত করতে হবে যে ব্যবহারকারী ব্রাউজারগুলি ব্যাক বোতাম টিপেছে এবং jquery ব্যবহার করে পৃষ্ঠাটি রিফ্রেশ (সামগ্রী এবং সিএসএস পুনরায় লোড করা) দিয়ে পুনরায় লোড করুন।

কিভাবে jquery মাধ্যমে এই ধরনের কর্ম সনাক্ত?

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

গুরুত্বপূর্ণ!

কিছু লোক সম্ভবত আমি যা চাই তা ভুল বুঝে ফেলেছে। আমি বর্তমান পৃষ্ঠাটি রিফ্রেশ করতে চাই না। আমি পিছনের বোতামটি চাপ দেওয়ার পরে লোড হওয়া পৃষ্ঠাটি রিফ্রেশ করতে চাই। আমি এখানে আরও বিশদভাবে বলতে চাই:

1. ব্যবহারকারী পৃষ্ঠা 1 দেখুন।
2. পৃষ্ঠা 1 এ থাকাকালীন - তিনি পৃষ্ঠা 2 এর লিঙ্কটিতে ক্লিক করেন।
3. তাকে পৃষ্ঠা 2 এ পুনঃনির্দেশিত করা হয়েছে
4. এখন (গুরুত্বপূর্ণ অংশ!) তিনি ব্রাউজারের পিছনে বোতামটি ক্লিক করেন কারণ তিনি পৃষ্ঠা 1 এ ফিরে যেতে চান
5. তিনি পৃষ্ঠা 1 এ ফিরে এসেছেন - এবং এখন পৃষ্ঠা 1 পুনরায় লোড হচ্ছে এবং "আপনি ফিরে এসেছেন" এর মতো কিছু সতর্ক করা হয়েছে!

Comments

সাধারণ ব্যবহারকারীর আচরণ হ্যাক করার পরিবর্তে আপনি কেন বোঝার চেষ্টা করবেন না যে কেন আপনার কোড পৃষ্ঠা লোডে কাজ করছে না এবং পৃষ্ঠাটি পুনরায় লোড করার জন্য আপনার প্রয়োজন?

— লেলিও ফাইটা

@ লেলিওফাইটা আমি পরিবর্তনগুলি দেখানোর জন্য ক্লাস পরিবর্তন করি। ব্যবহারকারী যদি অজ্যাক্সের মাধ্যমে ডাটাবেজে মান পরিবর্তনের জন্য ক্লিক করেন। যখন Ajax থেকে উদাহরণস্বরূপ সম্পন্ন CSS বর্গ cahnge হয় onথেকে off। এবং এটি ঠিক আছে, এটি ডিবিতে সংরক্ষিত হয়েছে, ব্যবহারকারীরা সবকিছু সঠিকভাবে দেখুন। এখন তিনি অন্য কয়েকটি লিঙ্কে ক্লিক করেন। আমাদের পৃষ্ঠা সম্পর্কে উদাহরণস্বরূপ, তাই না? এখন, তিনি আমাদের সম্পর্কে পৃষ্ঠায় আছেন। পূর্ববর্তী পৃষ্ঠায় ফিরে যাওয়ার সিদ্ধান্ত নিন এবং ব্রাউজারে পিছনে বোতামটি ক্লিক করুন। এবং যখন তিনি ফিরে আসেন, তখন তিনি পৃষ্ঠায় পরিবর্তনগুলি দেখতে পাচ্ছেন যেহেতু ব্রাউজারটি পৃষ্ঠাটি দেখিয়েছিল (সম্ভবত কিছু ব্রাউজার কেহিং) তিনি এজাক্সটি চালু করার আগে (ক্লাসে / অফ) বন্ধ করেছিলেন

— জন দোহারস্কিজ ২

আপনি কি আপনার আজাক্স কলের জন্য পেতে বা পোস্ট ব্যবহার করছেন?

— লেলিও ফাইটা 11'13

@ লেলিওফাইটা পার্ট 2 .. আমি ডেটা অ্যাট্রিবিউটও ব্যবহার করি এবং এর কোনও প্রভাব নেই। পৃষ্ঠাটি পুনরায় লোড করা থাকলে সবকিছু দুর্দান্ত হবে। আমি যদি সেই পৃষ্ঠায় F5 টিপুন তবে তিনি আজাক্সের মাধ্যমে পরিবর্তিত মানগুলি প্রদর্শিত হবে। আমি মনে করি এটি CSS এবং এইচটিএমএল অংশটি পুরোপুরি পুনরায় লোড না হওয়ার পরে এটি কিছু ব্রাউজার সম্পর্কিত সমস্যা ching এটি কেবল f5

— টিপানোর

@ লেলিওফাইটা $.ajax({ url: url, method: 'post', processData: false, contentType: false, cache: false, dataType: 'json', data: formData, })আপনি কি ভাবেন যে এটি আজাক্সের মাধ্যমে হতে পারে? এটি যদি হত তবে দুর্দান্ত হবে।

— জন দোহেরসকিজ 27'17

Answer 1

pageshowইতিহাস ট্র্যাভারসালের মাধ্যমে যখন ব্রাউজার আপনার পৃষ্ঠায় নেভিগেট করে পরিস্থিতি পরিচালনা করতে আপনি ইভেন্টটি ব্যবহার করতে পারেন :

window.addEventListener( "pageshow", function ( event ) {
  var historyTraversal = event.persisted || 
                         ( typeof window.performance != "undefined" && 
                              window.performance.navigation.type === 2 );
  if ( historyTraversal ) {
    // Handle page restore.
    window.location.reload();
  }
});

মনে রাখবেন যে এইচটিটিপি ক্যাশেও এতে জড়িত থাকতে পারে। আপনাকে কেবল ক্যাশগুলির প্রয়োজন সেই সমস্ত সংস্থানগুলিকে ক্যাশে করতে সার্ভারে যথাযথ ক্যাশে সম্পর্কিত HTTP শিরোনাম সেট করতে হবে। এছাড়াও আপনি উপেক্ষা করতে HTTP ক্যাশ instuct ব্রাউজারে বাধ্য রিলোড করতে পারেন: window.location.reload( true )। তবে আমি মনে করি না এটি সর্বোত্তম সমাধান is

আরও তথ্যের জন্য চেক করুন:

• এমডিএন-তে বিএফসিচে নিবন্ধের সাথে কাজ করা
• ওয়েবকিট পৃষ্ঠা ক্যাশে II - ব্রাডি আইডসনের আনলোড ইভেন্ট
• এমডিএন- তে পৃষ্ঠা প্রদর্শনের ইভেন্টের রেফারেন্স
• অ্যাজাক্স, ব্যাক বোতাম এবং ডোম আপডেট প্রশ্ন
• জাভাস্ক্রিপ্ট - bfcache / পেজ শো ইভেন্ট - ইভেন্ট.স্প্রেস্টেড সবসময় মিথ্যা হিসাবে সেট? প্রশ্ন

Comments

আপনি ধীরজ ব্যবহারকারীকে সঠিক পথে যেতে সাহায্য করতে পারেন তবে এটি দুটিবার পুনরায় লোড হচ্ছে। যাইহোক, আমি চেষ্টা করেছি window.addEventListener( "unload", function() {} );কিন্তু এটি কিছুই করছে না, পিছনের বোতামটি আগের মতো কাজ করে, কোনও পরিবর্তন হয় না; (

— জন দোহারস্কিজ

কীভাবে বিএফসিচে আনলোড করবেন? আপনি কি আরও নির্দিষ্ট তথ্য দিয়ে আপনার কোড আপডেট করতে পারবেন? এই লাইনটি window.addEventListener( "unload", function() {} );কাজ করে না। এটি কি সম্পূর্ণ?

— জন দোহেরস্কিজ

ক্রোম ইতিহাসের ট্র্যাভারসাল কিছুটা বিভ্রান্তিকর। pageshowসমাধান চেষ্টা করুন ।

— লিওনিড ভাসিলেভ

আমি এখনও একটি ডাবল লোড দেখতে পাচ্ছি; (একবার ডিফল্ট ফায়ারফক্স (পুরানো পৃষ্ঠাটি দেখায়; ব্রাউজারের ক্যাশে থেকে সম্ভবত?) এবং তারপরে স্ক্রিপ্টটি আবার জ্বলত। এক বা এক সেকেন্ডের জন্য (আমার ভিতরে কোড রয়েছে$(document).ready( function() { /* code here */ });

— জন দোহেরস্কিজ ২

window.performance.navigationঅবচয় করা হয়। নেভিগেশন টাইপটি আমি ব্যবহার করেছি তা পরীক্ষা করতেwindow.performance.getEntriesByType("navigation")[0].type === "back_forward"

— শূন্য01 আলফা

Answer 2

এটি পোস্ট হওয়ার পরে অনেকক্ষণ হয়ে গেছে তবে আপনাকে যদি পুরানো ব্রাউজারগুলি সমর্থন করার প্রয়োজন না হয় তবে আমি আরও মার্জিত সমাধান পেয়েছি।

আপনি একটি চেক করতে পারেন

performance.navigation.type

ব্রাউজার সমর্থন সহ ডকুমেন্টেশন এখানে: https://developer.mozilla.org/en-US/docs/Web/API/Performance/navication

পৃষ্ঠাটি ইতিহাস থেকে ফিরে লোড হয়েছিল কিনা তা ব্যবহার করে আপনি কী করতে পারেন তা দেখতে

if(performance.navigation.type == 2){
   location.reload(true);
}

2ইঙ্গিত পৃষ্ঠা ইতিহাস মধ্যে নেভিগেট করে অ্যাক্সেস করা হয়েছে। অন্যান্য সম্ভাবনাগুলি হ'ল-

0:লিঙ্ক, বুকমার্ক, ফর্ম জমা, বা স্ক্রিপ্ট অনুসরণ করে বা ঠিকানা বারে URL টাইপ করে পৃষ্ঠাটি অ্যাক্সেস করা হয়েছিল।

1:পুনঃলোড বোতামটি ক্লিক করে বা লোকেশন.রেলোড () পদ্ধতির মাধ্যমে পৃষ্ঠাটি অ্যাক্সেস করা হয়েছিল।

255: অন্য কোন উপায়

এগুলি এখানে বিশদ: https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNation

---

নোট Performance.navigation.type এখন পক্ষে অবচিত PerformanceNavigationTiming.type যা ফেরৎ 'নেভিগেট' / 'রিলোড' / 'back_forward' / 'পূর্বউপস্থাপন': https://developer.mozilla.org/en-US/docs/Web / এপিআই / পারফরম্যান্স নেভিগেশন টাইমিং / টাইপ

Comments

এই চেকটি আমার জন্য কাজ করেছিল। 2 এর অর্থ কী?

— রিচিডি

এটি একটি কবজির মতো কাজ করেছে .. আমি এটিকে বেশিরভাগ জায়গায় রেখেছি .. এবং পৃষ্ঠাটি অন্য কোনও স্ক্রিপ্ট লোড না করে পুনরায় লোড হচ্ছে।

— এনমাথুর

এটা চমত্কার ভাবে কাজ করেছে. দুর্দান্ত সন্ধান ... এটি অন্যান্য উত্তরগুলির মতো খুব দ্রুত এবং নির্ভরযোগ্য নয় যা এর তুলনায় ধীর ছিল। টিওয়াই

— জিতিন রাজ পিআর

এই একজন ক্রোম ব্রাউজারে কাজ করেছে এবং ফায়ারফক্সের সাথে নয়

— প্রবীণ ভিআর

এটি অবচয় করা হয়েছে ( w3c.github.io/navication-timing/#obsolete দেখুন )।

— ডেভিড ভিলহুবার

Answer 3

শুধু jquery ব্যবহার করুন:

jQuery( document ).ready(function( $ ) {

   //Use this inside your document ready jQuery 
   $(window).on('popstate', function() {
      location.reload(true);
   });

});

উপরেরগুলি এজ্যাক্স ব্যবহার করে পিছনে বা ফরোয়ার্ড বোতামটি ক্লিক করা হলে 100% কাজ করবে।

যদি এটি না হয় তবে স্ক্রিপ্টের আলাদা অংশে অবশ্যই একটি ভুল কনফিগারেশন থাকতে হবে।

উদাহরণস্বরূপ, এটি আগের পোস্টের উদাহরণের মতো কিছু ব্যবহার করা হলে এটি পুনরায় লোড করা যাবে না window.history.pushState('', null, './');

সুতরাং আপনি যখন ব্যবহার করবেন history.pushState(); তা নিশ্চিত হয়ে নিন যে আপনি এটি সঠিকভাবে ব্যবহার করেছেন।

বেশিরভাগ ক্ষেত্রে পরামর্শের প্রয়োজন আপনার কেবলমাত্র:

history.pushState(url, '', url); 

উইন্ডো হিস্টোরি নেই ... এবং নিশ্চিত ইউআরএল সংজ্ঞায়িত করা আছে।

আশা করি এইটি কাজ করবে..

Comments

এটি IE তে কাজ করে না। বিকাশকারী.মাইক্রোসফট.ওনস

— মাইক্রোসফ্ট- এড

@ রিচিডি - আজকের হিসাবে এটি উইন্ডোজ 10-এ আইই 11 এ ভালভাবে কাজ করে Note দ্রষ্টব্য: আমি এজ ব্যবহার করছি না not

— ড্যান জি

"শুধু jQuery ব্যবহার করুন" উত্তরগুলির অনুরাগী নন, দুঃখিত

— স্টিভেন

আমি HTTP ক্যাশে ব্যবহার করতে পুনরায় লোড থেকে "সত্য" মুছে ফেলব। বেশিরভাগ ক্ষেত্রে সম্পদ পুনরায় লোড করার কোনও অর্থ নেই।

— কনটিক

Answer 4

যেহেতু performance.navigationএখন অবহেলিত, আপনি এটি চেষ্টা করতে পারেন:

var perfEntries = performance.getEntriesByType("navigation");

if (perfEntries[0].type === "back_forward") {
    location.reload(true);
}

Comments

এটি সর্বাধিক আপ টু ডেট উত্তর

— জাভা_মান

উপরের লিওনিদের উত্তরে এই কোডটি কোডের সাথে একত্রিত করা দরকার।

— gornvix

এটা আমার জন্য ভাল কাজ করছে। আমি সর্বশেষতম ক্রোম, ফায়ারফক্স, আইই এবং এজতে পরীক্ষা করেছি। ম্যাকের সাফারি পরীক্ষা করে নি।

— তাসাওয়ার হুসেন

এটি একটি

— কবজির

Answer 5

"না" এর মান সহ আপনার রিফ্রেশ সূচক হিসাবে একটি লুকানো ইনপুট ব্যবহার করা উচিত:

<input type="hidden" id="refresh" value="no">

এখন jQuery ব্যবহার করে, আপনি এর মানটি পরীক্ষা করতে পারেন:

$(document).ready(function(e) {
    var $input = $('#refresh');

    $input.val() == 'yes' ? location.reload(true) : $input.val('yes');
});

আপনি যখন পিছনের বোতামটিতে ক্লিক করেন, লুকানো ক্ষেত্রগুলির মানগুলি যখন আপনি পৃষ্ঠাটি মূলত ছেড়ে গিয়েছিলেন তখন একই মান ধরে রাখে।

সুতরাং আপনি যখন পৃষ্ঠাটি প্রথমবার লোড করবেন তখন ইনপুটটির মান হবে "না"। আপনি যখন পৃষ্ঠাটিতে ফিরে আসবেন, এটি "হ্যাঁ" হবে এবং আপনার জাভাস্ক্রিপ্ট কোডটি একটি রিফ্রেশকে ট্রিগার করবে।

Comments

এটি কাজ করে না। আমি ফায়ারফক্স এবং ক্রোম নিয়েছি এবং এটি কাজ করছে না।

— জন দোহেরস্কিজ

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

— জন দোহেরস্কিজ

হ্যাঁ আমি ভুল বুঝেছি, বিস্তারিতভাবে প্রশ্ন আপডেট করার জন্য ধন্যবাদ।

— ধীরাজ

এখন এটা কাজ করছে. তবে এটি 2 বার পুনরায় লোড হচ্ছে এবং এটি কিছুটা অদ্ভুত দেখাচ্ছে। প্রথমবার এটি পুনরায় লোড হয়। কিছুই নয় - এটি সম্ভবত ডিফল্ট ব্রাউজারের আচরণ। দ্বিতীয়বার এটি পুনরায় লোড হয় - আপনার স্ক্রিপ্টের মাধ্যমে - মানগুলি যেমনটি হওয়া উচিত তেমন সতেজ করা হয় তবে এটি দেখতে খারাপ লাগে, কারণ এটি দুইবার পুনরায় লোড হয়। কীভাবে এটি সামান্য উন্নতি করবেন কোনও ধারণা, তাই পুনরায় লোডিং আরও ভাল দেখাচ্ছে বা কেবল একবার পুনরায় লোড হবে? এটি ফায়ারফক্সের চেয়ে Chrome এ আরও ভাল দেখায়, পুনরায় লোডিং দ্রুত হয় তবে আমি এখনও মূল ব্যাক স্টেটটি দেখতে পাই (দ্বিতীয় বা অর্ধেকের জন্য) এবং স্ক্রিপ্ট পুনরায় লোড কেবল তার পরে।

— জন দোহেরস্কিজ

"ডাবল লোড" কীভাবে ঠিক করবেন?

— জন দোহেরস্কিজ

Answer 6

আমার কাছে সমস্যার সমাধান করার একটি বিকল্প হ'ল পৃষ্ঠার ক্যাশে অক্ষম করা। এটি ক্যাশেড সংস্করণ ব্যবহার না করে সার্ভার থেকে পৃষ্ঠাটি পেতে ব্রাউজারটিকে তৈরি করে:

Response.AppendHeader("Cache-Control","no-cache, no-store, must-revalidate");
Response.AppendHeader("Pragma", "no-cache");
Response.AppendHeader("Expires", "0");

Comments

সেরা সমাধান, তবে আমি যে সংস্করণটি ব্যবহার করেছি তা এখানে। Response.Cache.SetCacheability(HttpCacheability.NoCache); Response.Cache.SetMaxAge(TimeSpan.Zero); Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches); Response.Cache.SetNoStore();

— উদ্যোগ

Answer 7

ব্যবহারকারী ব্যাক বোতামটি ক্লিক করলে বর্তমানে এটি সর্বাধিক টু ডেট ওয়ে রিলোড পৃষ্ঠাটি page

const [entry] = performance.getEntriesByType("navigation");

// Show it in a nice table in the developer console
console.table(entry.toJSON());

if (entry["type"] === "back_forward")
    location.reload();

উত্স জন্য এখানে দেখুন

Answer 8

পুনরায় লোড করা সহজ। আপনার ব্যবহার করা উচিত:

location.reload(true);

এবং ফিরে সনাক্তকরণ হ'ল:

window.history.pushState('', null, './');
  $(window).on('popstate', function() {
   location.reload(true);
});

Comments

কাজ করছে না; (আমি এর alert('test');পরিবর্তে চেষ্টা করেছি location.reload(true);কিন্তু এখনও কিছুই নেই I আমি ফায়ারফক্স এবং ক্রোম ছাড়া কিছুই চেষ্টা করেছি I আমি বাইরে নথির ভিতরে থাকা নথির চেষ্টা করেছি, তবে কিছুই কাজ করে না if যদি আমি সাধারণ সতর্কতা চেষ্টা করি) () বা কোনও জেকোরি কোড এটি কাজ করে I আমার পৃষ্ঠায় প্রচুর

— জেকারি

আমি উত্তর সম্পাদনা করেছি, নতুন সমাধান চেষ্টা করুন। আপনার আগে রাষ্ট্রকে ধাক্কা দেওয়ার দরকারটি হল, বা আপনি পপস্টেট ইভেন্ট পাবেন না।

— আন্তন স্টেপেনেনকোভ

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

— জন দোহেরস্কিজ

Answer 9

আপনার এইচটিএমএল শিরোলেখ ফাইলে নিম্নলিখিত মেটা ট্যাগ ব্যবহার করুন, এটি আমার পক্ষে কাজ করে।

<meta http-equiv="Pragma" content="no-cache">

Comments

এটি পৃষ্ঠায় ফিরে গেলে পুনরায় লোড করবে না, যা ওপি অনুরোধ করেছে

— টিম্বারম্যান

Answer 10

আমি সবচেয়ে ভাল উত্তর পেয়েছি এবং এটি আমার জন্য নিখুঁতভাবে কাজ করছে

আপনার লিঙ্কটিতে কেবল এই সাধারণ স্ক্রিপ্টটি ব্যবহার করুন

<A HREF="javascript:history.go(0)">next page</A>

বাটন ক্লিক ইভেন্ট

<INPUT TYPE="button" onClick="history.go(0)" VALUE="next page">

আপনি যখন এটি ব্যবহার করেন, আপনি প্রথমে আপনার পৃষ্ঠাটি রিফ্রেশ করুন এবং তারপরে পরবর্তী পৃষ্ঠায় যান, যখন আপনি ফিরে আসবেন এটি সর্বশেষ রিফ্রেশ অবস্থায় থাকবে।

আমি এটি একটি সিএএস লগইনে ব্যবহার করেছি এবং যা চাই তা আমাকে দেয়। আশা করি এটা সাহায্য করবে .......

বিস্তারিত এখান থেকে পাওয়া যায়

Comments

এটি আমার জন্য কাজ করছে না। "0" কোনটি উপস্থাপন করে?

— ভিনসেন্ট