将id搜索放入form

2024-03-27 21:22:28 +08:00 · 2024-03-27 21:22:28 +08:00 · 8b3291c8e5
parent 4a29a791a2
commit 8b3291c8e5
7 changed files with 42 additions and 40 deletions
--- a/multi.html
+++ b/multi.html
@ -1281,7 +1281,9 @@ const teamsCount = 2;
 				<input type="checkbox" class="switch-ipt" name="real-time-change-card" id="real-time-change-card"><label class="switch-lbl" for="real-time-change-card"><circle></circle></label>
 				<button class="open-evolutionary-tree display-none"></button>
 				<button class="search-evolution-by-this display-none"><icon class="type-icon" data-type-icon="0"></icon></button>
-				<input type="search" class="m-id"/><button class="search-by-string"></button>
+				<form id="form-id-search">
+					<input type="search" id="m-id"/><button type="sumbit" id="search-by-string"></button>
+				</form>
 				<ul class="evo-card-list"></ul>
 			</div>
 			<div class="setting-row row-mon-latent">
--- a/script-universal_function.js
+++ b/script-universal_function.js
@ -1053,7 +1053,7 @@ function cardNClick() {
 //技能介绍里的头像的切换
 function changeToIdInSkillDetail(event) {
 	const settingBox = editBox.querySelector(".setting-box");
-	const monstersID = settingBox.querySelector(".row-mon-id .m-id");
+	const monstersID = settingBox.querySelector(".row-mon-id #m-id");
 	const mid = this.getAttribute("data-cardid");
 	monstersID.value = mid;
 	monstersID.onchange();
--- a/script.js
+++ b/script.js
@ -4401,7 +4401,7 @@ function initialize() {
 	function searchByString(str)
 	{ // 考虑了一下onlyInTag被废弃了，因为和游戏内搜索不符
 		str = str.trim();
-		if (str === '0') { //如果搜索0，则打开最新的50个
+		if (str.length == 0) { //如果搜索0，则打开最新的50个
 			return Cards.filter(card=>card.enabled).slice(-50);
 		} else if (str.length>0)
 		{
@ -4508,10 +4508,10 @@ function initialize() {
 	};
 	//创建一个新的怪物头像
 	editBox.createCardHead = function(id, options = {}) {
-		function clickHeadToNewMon() {
+		function clickHeadToNewMon(event) {
+			event.preventDefault(); //取消链接的默认操作
 			monstersID.value = this.card.id;
-			monstersID.onchange();
-			return false; //取消链接的默认操作
+			formIdSearch.onsubmit();
 		}
 		const cli = document.createElement("li");
 		const cdom = cli.head = createCardA(options);
@ -5310,12 +5310,13 @@ function initialize() {

 	//id搜索
 	editBox.changeMonId = editBoxChangeMonId;
-	const monstersID = settingBox.querySelector(".row-mon-id .m-id");
-	const btnSearchByString = settingBox.querySelector(".row-mon-id .search-by-string");
+	
 	function idChange(event)
 	{
-		if (/^\d+$/.test(this.value)) {
-			const newId = parseInt(this.value, 10);
+		event?.preventDefault();
+		const searchString = monstersID.value;
+		if (/^\d+$/.test(searchString)) { //纯ID
+			const newId = parseInt(searchString, 10);
 			if (editBox.mid != newId) //避免多次运行oninput、onchange
 			{
 				editBox.mid = newId;
@ -5338,33 +5339,27 @@ function initialize() {
 				editBox.changeMonId(newId);
 			}
 			return true;
-		}else
+		}else //字符串搜索
 		{
+			showSearch(searchByString(searchString));
 			return false;
 		}
 	}
-	monstersID.onchange = idChange;
-	monstersID.onkeydown = function(event) {
-		//如果键入回车，字符串长度大于0，且不是数字，则执行字符串搜索
-		if (event.key === "Enter" && this.value.length > 0 && !/^\d+$/.test(this.value))
-		{
-			showSearch(searchByString(this.value));
-		}
-	}
+
+	const formIdSearch = document.getElementById("form-id-search");
+	formIdSearch.onsubmit = idChange;
+	const monstersID = document.getElementById("m-id");
+	const btnSearchByString = document.getElementById("search-by-string");
 	//输入id数字即时更新的开关
 	const realTimeClassName = 'real-time-change-card';
-	const s_realTimeChangeCard = settingBox.querySelector(`#${realTimeClassName}`);
+	const s_realTimeChangeCard = document.getElementById(realTimeClassName);
 	s_realTimeChangeCard.onchange = function(e) {
-		monstersID.oninput = this.checked ? idChange : null;
+		monstersID.oninput = this.checked ? ()=>{formIdSearch.onsubmit();} : null;
 		if (e) localStorage.setItem(cfgPrefix + realTimeClassName, Number(this.checked));
 	}
 	s_realTimeChangeCard.checked = Boolean(Number(localStorage.getItem(cfgPrefix + realTimeClassName)));
 	s_realTimeChangeCard.onchange(false);

-	//字符串搜索
-	btnSearchByString.onclick = function() {
-		showSearch(searchByString(monstersID.value));
-	};
 	//觉醒
 	const monEditOuterAwokensRow = editBox.querySelector(".row-awoken-sawoken");
 	const monEditAwokensRow = monInfoBox.querySelector(".row-mon-awoken");
@ -6129,9 +6124,10 @@ function editMember(teamNum, isAssist, indexInTeam) {
 	}

 	const settingBox = editBox.querySelector(".setting-box");
-	const monstersID = settingBox.querySelector(".row-mon-id .m-id");
+	const formIdSearch = document.getElementById("form-id-search");
+	const monstersID = document.getElementById("m-id");
 	monstersID.value = mon.id > 0 ? mon.id : 0;
-	monstersID.onchange();
+	formIdSearch.onsubmit();
 	//觉醒
 	const monEditOuterAwokensRow = editBox.querySelector(".row-awoken-sawoken");
 	const monEditAwokens = monEditOuterAwokensRow.querySelectorAll(".row-mon-awoken .awoken-ul input[name='awoken-number']");
--- a/service-worker.js
+++ b/service-worker.js
@ -24339,7 +24339,7 @@ const cachesMap = new Map([
 	],
 	[
 		"browser-compatibility.js",
-		"f4691d93d01d22ba05d019d7d3999b87"
+		"7080930e96f7e1f6897642ce00b34853"
 	],
 	[
 		"index.html",
@ -24347,7 +24347,7 @@ const cachesMap = new Map([
 	],
 	[
 		"multi.html",
-		"f9114de02bf81cbf7ef5b2adfb783cad"
+		"255d38665bf0a7bbdcde58d0824d88e0"
 	],
 	[
 		"script-custom_elements.js",
@ -24355,7 +24355,7 @@ const cachesMap = new Map([
 	],
 	[
 		"script-json_data.js",
-		"b356e8212ceeea0bcbc9697ab9ae40c3"
+		"43800af239665a635175e0008662119d"
 	],
 	[
 		"script-skill-parser.js",
@ -24363,15 +24363,15 @@ const cachesMap = new Map([
 	],
 	[
 		"script-universal_function.js",
-		"d3a0195bad5e8ad651e4ac246ddae0d2"
+		"fe5c5892ce3df85b1c3f0777183771f3"
 	],
 	[
 		"script.js",
-		"4c8cd17573fe873e384d19668bcf0cf9"
+		"075aa361ba83128863f63351923e2014"
 	],
 	[
 		"solo.html",
-		"5404fbbdb80f51c01a39504681523186"
+		"520a497bef09dd94295b10ced945475f"
 	],
 	[
 		"style-monsterimages.css",
@ -24379,7 +24379,7 @@ const cachesMap = new Map([
 	],
 	[
 		"style.css",
-		"dd82b5180cb8e1e257e91b88b8f5f9d7"
+		"ce2f2b8cfd87e15275c5be72355279dc"
 	],
 	[
 		"temp.js",
@ -24387,7 +24387,7 @@ const cachesMap = new Map([
 	],
 	[
 		"triple.html",
-		"0be2f6428c47d2e8bf7233ba845138de"
+		"a27f67a57a6e64f7afeec0d70ef7df9b"
 	],
 	[
 		"languages/en.css",
--- a/solo.html
+++ b/solo.html
@ -1019,7 +1019,9 @@ const teamsCount = 1;
 				<input type="checkbox" class="switch-ipt" name="real-time-change-card" id="real-time-change-card"><label class="switch-lbl" for="real-time-change-card"><circle></circle></label>
 				<button class="open-evolutionary-tree display-none"></button>
 				<button class="search-evolution-by-this display-none"><icon class="type-icon" data-type-icon="0"></icon></button>
-				<input type="search" class="m-id"/><button class="search-by-string"></button>
+				<form id="form-id-search">
+					<input type="search" id="m-id"/><button type="sumbit" id="search-by-string"></button>
+				</form>
 				<ul class="evo-card-list"></ul>
 			</div>
 			<div class="setting-row row-mon-latent">
--- a/style.css
+++ b/style.css
@ -1415,13 +1415,13 @@ body:not(.solo) .awoken-icon[data-awoken-icon="64"]::after
 /*.edit-box .setting-box .row-mon-id::before{
 	content: "▼怪物ID";
 }*/
-.edit-box .setting-box .row-mon-id .m-id{
+.edit-box .setting-box .row-mon-id #m-id{
 	box-sizing: border-box;
 	font-size: 25px;
 	height: 40px;
 	width: calc(100% - 50px);
 }
-.edit-box .setting-box .row-mon-id .search-by-string{
+.edit-box .setting-box .row-mon-id #search-by-string{
 	box-sizing: border-box;
 	font-size: 25px;
 	height: 40px;
@ -1429,7 +1429,7 @@ body:not(.solo) .awoken-icon[data-awoken-icon="64"]::after
 	margin-left: 5px;
 	padding: 0;
 }
-.edit-box .setting-box .row-mon-id .search-by-string::before{
+.edit-box .setting-box .row-mon-id #search-by-string::before{
 	content: "🔍";
 }
 .edit-box .setting-box .row-mon-id .unable-monster{
--- a/triple.html
+++ b/triple.html
@ -1963,7 +1963,9 @@ const teamsCount = 3;
 				<input type="checkbox" class="switch-ipt" name="real-time-change-card" id="real-time-change-card"><label class="switch-lbl" for="real-time-change-card"><circle></circle></label>
 				<button class="open-evolutionary-tree display-none"></button>
 				<button class="search-evolution-by-this display-none"><icon class="type-icon" data-type-icon="0"></icon></button>
-				<input type="search" class="m-id"/><button class="search-by-string"></button>
+				<form id="form-id-search">
+					<input type="search" id="m-id"/><button type="sumbit" id="search-by-string"></button>
+				</form>
 				<ul class="evo-card-list"></ul>
 			</div>
 			<div class="setting-row row-mon-latent">