☰

AO3 分页增强

为AO3 添加跳转页码功能

  1. // ==UserScript==
  2. // @name         AO3 Pagination Enhancement
  3. // @name:zh-CN   AO3 分页增强
  4. // @namespace    http://tampermonkey.net/
  5. // @version      0.1.1
  6. // @description  Add page jumping feature to AO3 pagination
  7. // @description:zh-CN  为AO3 添加跳转页码功能
  8. // @author       acacius
  9. // @match        https://archiveofourown.org/*
  10. // @grant        GM_addStyle
  11. // @license      MIT
  12. // ==/UserScript==
  13.  
  14. (function() {
  15.     'use strict';
  16.  
  17.     // Function to handle page jump
  18.     function jumpToPage() {
  19.         const inputElement = document.getElementById('jumpToPageInput');
  20.         if (inputElement) {
  21.             const page = parseInt(inputElement.value);
  22.             const maxPage = parseInt(document.querySelector('.pagination.actions li.next').previousElementSibling.querySelector('a').innerText);
  23.             if (!isNaN(page) && page > 0 && page <= maxPage) {
  24.                 // Build the new URL with the selected page
  25.                 const currentUrl = new URL(window.location.href);
  26.                 currentUrl.searchParams.set('page', page);
  27.                 window.location.href = currentUrl.toString();
  28.             }
  29.         }
  30.     }
  31.  
  32.     // Insert input box and button after the pagination
  33.     const pagination = document.querySelector('.pagination.actions');
  34.     if (pagination) {
  35.         const jumpContainer = document.createElement('div');
  36.         const maxPageValue = parseInt(document.querySelector('.pagination.actions li.next').previousElementSibling.querySelector('a').innerText);
  37.         jumpContainer.innerHTML = `
  38.             <input type="number" id="jumpToPageInput" placeholder="Page" style="width: 60px; margin-right: 5px;" min="1" max="${maxPageValue}">
  39.             <button id="jumpToPageButton">Go</button>
  40.         `;
  41.         pagination.appendChild(jumpContainer);
  42.  
  43.         // Add event listener for the button click
  44.         const jumpButton = document.getElementById('jumpToPageButton');
  45.         if (jumpButton) {
  46.             jumpButton.addEventListener('click', jumpToPage);
  47.         }
  48.  
  49.         // Add event listener for pressing Enter in the input box
  50.         const jumpInput = document.getElementById('jumpToPageInput');
  51.         if (jumpInput) {
  52.             jumpInput.addEventListener('keyup', function(event) {
  53.                 if (event.key === 'Enter') {
  54.                     jumpToPage();
  55.                 }
  56.             });
  57.         }
  58.     }
  59.  
  60.     // Add sticky style to the pagination element
  61.     GM_addStyle(`
  62.         .pagination.actions {
  63.             position: sticky;
  64.             bottom: 0;
  65.             background-color: white; /* Adjust as needed */
  66.             z-index: 1000; /* Adjust as needed */
  67.         }
  68.     `);
  69. })();