forked from cikichen/fq-novel-store
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
1 lines (1 loc) · 3.58 KB
/
index.html
File metadata and controls
1 lines (1 loc) · 3.58 KB
1
<!doctype html><html><head><meta charset="utf-8"><title> fq-novel-store </title><style>.box { border: 1px solid #000000; margin: 10px auto; width: 40%; padding: 10px; border-radius: 15px; -webkit-box-shadow: 1px 1px 1px #000000; box-shadow: 1px 1px 1px #000000; cursor: pointer; text-align: center; transition-duration: 0.6s; font-size: large; margin-top: 20px; margin-right: auto; margin-left: auto; margin-bottom: 10px;}.box:hover { transition-duration: 0.6s; transform: scale(1.05);}#search { width: 40%; font-size: 16px; padding: 12px 20px 12px 40px; border: 1px solid #ddd;}.popup { display: none; position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); }.popup-content { background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 80%; max-width: 600px; }.popup-btn { padding: 10px 20px; margin: 10px 5px; cursor: pointer; background-color: #4CAF50; color: white; border: none; border-radius: 5px;}.popup-btn:hover { background-color: #45a049;}</style><script src="https://code.jquery.com/jquery-3.7.1.min.js"> </script> <script> function search() { var input, filter, boxes, i, txtValue; input = document.getElementById('search'); filter = input.value.toUpperCase(); boxes = document.querySelectorAll('#booklist .box'); for (i = 0; i < boxes.length; i++) { txtValue = boxes[i].textContent || boxes[i].innerText; if (txtValue.toUpperCase().indexOf(filter) > -1) { boxes[i].style.display = ''; } else { boxes[i].style.display = 'none'; } } } function fetchTextFile(url, filename) { var xhr = new XMLHttpRequest(); xhr.open('GET', url, true); xhr.responseType = 'blob'; xhr.onload = function() { if (xhr.status === 200) { var blob = xhr.response; var url = URL.createObjectURL(blob); var a = document.createElement('a'); a.href = url; a.download = filename; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } else { console.error('下载文件失败: ' + xhr.statusText); } }; xhr.onerror = function() { console.error('请求失败'); }; xhr.send(); } </script></head><body style="text-align: center"><h1> fq-novel-store </h1><input type="text" id="search" onkeyup="search()" placeholder="搜索.."><div id="booklist"> </div><div id="popup" class="popup"> <div class="popup-content"> <h2> 选择操作 </h2> <p id="openPopup" style="color: #656565"> tip:点击后请耐心等待下载 </p> <button class="popup-btn" onclick="selectOption(1)"> 下载 </button> <button class="popup-btn" onclick="selectOption(2)"> 在线阅读 </button> <button class="popup-btn" onclick="closePopup()"> 关闭 </button> </div></div><script> $.getJSON("booklist.json", function(data) { var $booklist = $('#booklist'); $booklist.empty(); $.each(data, function(i, item) { $booklist.append('<div class="box" data-name="' + item + '">' + item + '</div>'); }); $('#booklist').on('click', '.box', function() { document.getElementById("popup").bookname = $(this).data('name'); openPopup(); }); }).fail(function(jqXHR, textStatus, errorThrown) { console.error("获取数据失败: " + textStatus, errorThrown); }); function openPopup() { document.getElementById("popup").style.display = "block"; } function closePopup() { document.getElementById("popup").style.display = "none"; } function selectOption(option) { var bookname = document.getElementById("popup").bookname; if (option == 1) { var filename = bookname + '.txt'; var url = 'book/' + filename; fetchTextFile(url, filename); } else { window.open('read.html?name=' + encodeURIComponent(bookname).replace(/%/g, '!')) } closePopup(); } </script></body></html>