TDD
The Dev's Desk11mo ago
rival-black

สอบถาม JavaScript หน่อยครับ

สวัสดีครับ อยากให้ช่วยดูฟังก์ชัน JS หน่อยครับ ถ้าอยากเขียนลบได้ทุกครั้งที่เพิ่มเขียนยังไงครับ เช่น พิมพ์เลขไปแล้ว 5 หลัก สามารถลบเลขได้ หรือพิมพ์ไปแล้ว 5 หลัก ลบไป 1 หลักแล้วสามารถพิมพ์ต่อได้ ตอนนี้ปัญหาที่ติดคือถ้าใส่เลขไม่ครบทุกหลักจะลบไม่ได้ หรือใส่ครบทุกหลักแล้วลบไป 1 หลักแล้วใส่เลขต่อไม่ได้จนกว่าจะลบครบทุกหลักครับ
No description
No description
19 Replies
rival-black
rival-blackOP11mo ago
อันนี้ code ของ HTML ครับ
No description
rare-sapphire
rare-sapphire11mo ago
chatgpt ได้บ่คับ
qwrts
qwrts11mo ago
@Covid-23 แปะแท็ค Fixed ไว้คนนึกว่าแก้ปัญหาได้แล้วนะครับ เขาอาจจะไม่ได้มาช่วยนะครับ
rival-black
rival-black11mo ago
ใส่ไมไ่ด้เพราะ เงื่อนไข === 0 มันจะให้ focus กลับไปที่ prevInput เสมอ ลองเชื่อม Conditional Statements สองอันไว้ด้วยกันก่อน จาก if อย่างเดียวให้เชื่อมเป็น else if จากนั้น else โดยการกำหนดเงื่อนไขสุดท้าย เป็น focus currentInput และให้เพิ่ม Conditional ของ nextInput และ prevInput ให้มีการเช็ค .value ว่ามีค่าหรือไม่ ถ้าแทรก raw Code มาบนกระทู้ผมอาจจะ review code และทดสอบให้แต่แนบมาเป็นภาพ น่าจะยุ่งยากเกินไป
qwrts
qwrts11mo ago
เดี๋ยวผมทำ Instructions ให้เป็นปักหมุดของช่องนี้ให้นะครับ หลายท่านจะได้เข้าใจวิธีการสอบถามปัญหากัน @Covid-23 ติกแท็ค ✅ Fixed ไว้คือแก้ได้แล้วใช่ไหมครับ ผมจะได้ล็อคโพสต์ครับผม
rival-black
rival-blackOP11mo ago
ยังครับ โทษทีครับ
function moveFocus(currentInput, index) {
const inputs = currentInput.parentElement.children;
if (currentInput.value.length === 1) {
const nextInput = inputs[index + 1];
if (nextInput) {
nextInput.focus();
}
}
if (currentInput.value.length === 0) {
const prevInput = inputs[index - 1];
if (prevInput) {
prevInput.focus();
}
}
}
function moveFocus(currentInput, index) {
const inputs = currentInput.parentElement.children;
if (currentInput.value.length === 1) {
const nextInput = inputs[index + 1];
if (nextInput) {
nextInput.focus();
}
}
if (currentInput.value.length === 0) {
const prevInput = inputs[index - 1];
if (prevInput) {
prevInput.focus();
}
}
}
ให้ ChatGPT แก้ให้ก็ยังไม่ได้เลยครับ
qwrts
qwrts11mo ago
รบกวนใส่เป็น code block ทีครับผม https://discord.com/channels/1236751677801889792/1236771474350542860/1311232895335010345 แบบนี้เลยครับ โค้ดที่ส่งมา แล้วพออธิบายให้ฟังทีนะครับ ว่าอันนี้คืออะไร กำลังทำอะไรกันครับผม @Covid-23 ถ้าผมเข้าใจไม่ผิด ตรงนี้คือเหมือน input ทีละช่องใช่ไหมครับ พอใส่ตัวเลขไปแล้วอยากให้มันเลื่อนไปตำแหน่งต่อไปให้ผู้ใช้งานพิมพ์ต่อใช่ไหมครับ
rival-black
rival-black11mo ago
คือเขาน่าจะทำเพื่อให้มันสามารถ Input ด้วยคีย์บอร์ดอย่างเดียว โดยไม่ต้องใช้เมาส์ แบบเวลาเราพิมพ์แล้ว เลื่อนช่องให้เลยแต่ปัญหาจะเกิดคือถ้าเราเลื่อนมาลำดับก่อนหน้าที่มากกว่า 1 ลำดับ เช่น พิมพ์ มาถึง ตัวที่ 3 แล้วกลับไปแก้ที่ตัว ที่ 1 ปัญหาคือน่าจะหมายถึงพอลบแล้วมันไปลำดับที่ 2 แทน ซึ่งตำแหน่ง ที่ 1 เราพึ่งลบไป กลับไม่ได้พิมพ์ต่อจากลำดับที่ 1 ผมเดานะ แต่ถ้าจาก Code ผมมองว่ามันน่าจะเลื่อนไปลำดับถัดไปเสมอ
qwrts
qwrts11mo ago
หมายความว่า จากที่อ่านคือ ไม่ว่าจะลบหรือเขียน มันก็ไปเรื่อยๆเหรอครับ ผมเข้าใจถูกไหมนะ
rival-black
rival-black11mo ago
ตาม Conditional มันไม่ไปข้างหน้า ก็กลับมาข้างหลัง ไม่มี ให้อยุ่ตำแหน่งเดิม
qwrts
qwrts11mo ago
@Covid-23 ตอนนี้แก้ได้รึยังครับผม
rival-black
rival-blackOP11mo ago
@qwrts ยังครับ ที่ติดอยู่ตอนนี้คือ สมมุติผู้ใช้พิมพ์เลขไปได้ 5 ช่องแล้ว input ถัดไปอยู่ช่อง 6 แต่บังเอิญพิมพ์เลขช่อง 5 ผิด อยากไปลบแต่กด backspace ลบไปเลยไม่ได้ครับ มันจะต้องไปคลิกที่ input ช่อง 5 ก่อนถึงจะลบได้ครับ คือในส่วนนี้ผมไม่แน่ใจว่าตามหลัก มันควรจะออกแบบให้กดลบได้โดยที่ไม่ต้องไปคลิกช่องที่ต้องการลบเพิ่มด้วยหรือเปล่านี่สิครับ ถ้าควรจึงไม่รู้จะออกแบบเพิ่มยังไงดี??
qwrts
qwrts11mo ago
พอจะเข้าใจที่ต้องการแล้วครับ ถ้าตามโค้ดในฟังก์ชั่นที่ให้มา ก็คือตัวนี้ใช่ไหมครับ มันไปหน้าได้แต่ถอยไม่ได้ ลองเปลี่ยนจาก onInput เป็น onChange ดูไหมครับ @Covid-23 onChange มันจะทำงานเลยตอนมีการเปลี่ยนแปลงค่าของ input
stormy-gold
stormy-gold11mo ago
ลองอันนี้ดูครับผมเพิ่ม EventListener ให้เพื่อตรวจสอบจากการกดปุ่ม BackSpace ในโค้ดที่ผมเพิ่มไปมันจะไปลบเลขก่อนหน้าได้ต่อเมื่อ currentInput ไม่มีค่า และถ้ามีค่ามันจะลบค่าในช่องนั้นก่อนครับ
function moveFocus(currentInput, index) {
const inputs = currentInput.parentElement.children;

currentInput.addEventListener('keydown', (event) => {
if (event.key === 'Backspace' && currentInput.value.length === 0) {
const prevInput = inputs[index - 1];
if (prevInput) {
prevInput.focus();
prevInput.value = '';
}
}
});

if (currentInput.value.length === 1) {
const nextInput = inputs[index + 1];
if (nextInput) {
nextInput.focus();
}
}
}
function moveFocus(currentInput, index) {
const inputs = currentInput.parentElement.children;

currentInput.addEventListener('keydown', (event) => {
if (event.key === 'Backspace' && currentInput.value.length === 0) {
const prevInput = inputs[index - 1];
if (prevInput) {
prevInput.focus();
prevInput.value = '';
}
}
});

if (currentInput.value.length === 1) {
const nextInput = inputs[index + 1];
if (nextInput) {
nextInput.focus();
}
}
}
rival-black
rival-blackOP11mo ago
โห ขอบคุณมากครับ อันนี้แหละใช่เลยครับ ไม่มี tag fixed ให้ใส่แล้วเหรอครับ @qwrts
qwrts
qwrts11mo ago
ใช้เป็นคำสั่ง /fixed แทนครับผม ตอนนี้เวลาเปิดห้องใหม่แล้วเดี๋ยวจะมีปุ่มให้กดฮะ
rival-black
rival-blackOP11mo ago
@qwrts มันบอกผมไม่ใช่เจ้าของโพสต์!?
qwrts
qwrts11mo ago
กำ เดี๋ยวแก้บัคให้ครับ 555 @Covid-23 ลองใหม่ได้ไหมครับ ผมแก้แล้วนะครับ งั้นเดี๋ยวผมขออณุญาตปิดโพสต์เลยนะครับ
optimistic-gold
optimistic-gold11mo ago
🔒 โพสต์ถูกล็อคแล้ว โพสต์นี้ถูกตั้งสถานะว่า แก้ไขเรียบร้อยแล้ว หากมีคำถามเพิ่มเติม กรุณาทำการโพสต์ใหม่ได้ที่หมวดหมู่ <#1236768988663644261>

Did you find this page helpful?