لحل هذه المشكلة، يمكنك استخدام JavaScript أو JQuery مع LocalStorage لتحقيق السلوك المطلوب بدلاً من استخدام history.go(-1)
.
أولاً، عليك تحديد صفحة القادمة (page1.html
, page2.html
, أو page3.html
) عند النقر على الارتباط في glossary.html
. يمكنك فعل ذلك عن طريق تحديد id للصفحة المحددة وحفظها في LocalStorage.
ثم، عندما يتم النقر على الزر “↵ Go back” في glossary.html
، يجب تحديث href
للارتباط بحيث يشير إلى الصفحة التي تم تحديدها سابقًا. يمكنك القيام بذلك بالتحقق من ال id المحفوظ في LocalStorage وتحديث href
وفقًا لذلك.
إليك كيفية تنفيذ هذا السلوك باستخدام JQuery:
javascript$(document).ready(function() {
// Check if the id of the calling page is stored in localStorage
var callingPageId = localStorage.getItem('callingPageId');
// Update the href of the glossary link to point to the calling page
if (callingPageId) {
$('#fn1').attr('href', callingPageId + '.html#' + callingPageId);
}
// Store the id of the calling page when a glossary link is clicked
$('.footnote').click(function() {
var callingPageId = $(this).parent().attr('id');
localStorage.setItem('callingPageId', callingPageId);
});
});
هذا الكود يحدد الصفحة المحددة عند النقر على الرابط في glossary.html
ويحفظها في LocalStorage. ثم، عندما يتم النقر على الزر “↵ Go back”، يتم تحديث الرابط في glossary.html
ليشير إلى الصفحة التي تم تحديدها سابقًا.
يرجى ملاحظة أنه يجب أن يتم تضمين JQuery في صفحاتك لاستخدام الكود السابق.
المزيد من المعلومات
بالطبع! يمكنك تحسين الكود المذكور أعلاه لجعله أكثر كفاءة وإحكاماً. على سبيل المثال، يمكنك استخدام دالة لتحديث الرابط في glossary.html
بناءً على الصفحة المحددة في LocalStorage. إليك كيفية القيام بذلك:
javascript$(document).ready(function() {
function updateGlossaryLink() {
var callingPageId = localStorage.getItem('callingPageId');
if (callingPageId) {
$('#fn1').attr('href', callingPageId + '.html#' + callingPageId);
}
}
// Update the glossary link when the page loads
updateGlossaryLink();
// Store the id of the calling page when a glossary link is clicked
$('.footnote').click(function() {
var callingPageId = $(this).parent().attr('id');
localStorage.setItem('callingPageId', callingPageId);
updateGlossaryLink(); // Update the glossary link immediately
});
});
هذا التحسين يجعل الكود أكثر تنظيمًا ويفادي تكرار التعديل على رابط العودة في كل مرة يتم فيها النقر على الرابط في glossary.html
.