0
189
VisualizaçõesCómo navegar en los botones usando las teclas de flecha en lugar de la pestaña
Tengo un modo de arranque que tiene una tabla. Quiero navegar en los botones usando las teclas de flecha en lugar de las pestañas...
Lo he probado usando el enfoque automático pero no funciona.
Código JavaScript
for (let i = 0; i < res.data.data.length; i++) { table__body.innerHTML += `<tr> <td id="english_name"> <p> ${res.data.data[i].english_name} </p></td> <td id="mrp_price"> <p> ${res.data.data[i].mrp_price} </p></td> <td id="sale_price"> <p> ${res.data.data[i].sale_price} </p></td> <td id="barcode"> <p> ${res.data.data[i].barcode} </p></td> <td id="tax_per" class="d-none"> <p> ${res.data.data[i].tax_per} </p></td> <td id="product_tax_id" class="d-none"> <p> ${res.data.data[i].product_tax_id} </p></td> <td id="product_unit_id" class="d-none"> <p> unit ${res.data.data[i].product_unit_id} </p></td> <td id="product_id" class="d-none" <p> ${res.data.data[i].product_id} </p></td> <td id="purchase_price" class="d-none" <p> ${res.data.data[i].purchase_price} </p></td> <td id="production_price" class="d-none" <p> ${res.data.data[i].production_price} </p></td> <td id="franchise_price" class="d-none" <p> ${res.data.data[i].franchise_price} </p></td> <input type="hidden" value="${res.data.data[i].point_value}" id="point_value" /> <td><button type="button" onclick="productWithSameBarcode(this)" id="focus_on_add_button${i + 1}" class="btn btn-primary">Add</button></td> </tr>`; } document.getElementById("call_modal").click(); let btn = document.getElementById("focus_on_add_button1") console.log(btn.setAttribute('autofocus')) console.log("focus set")
·
Juan Pablo Isaza
2 Respostas
Responde à pergunta0
document.onkeydown = (e) => { if (e.keyCode === 38) { console.log('up arrow pressed') } else if (e.keyCode === 40) { console.log('down arrow pressed') } else if (e.keyCode === 37) { console.log('left arrow pressed') } else if (e.keyCode === 39) { console.log('right arrow pressed') } }
·
Juan Pablo Isaza
Relatório
0
let count = 0; let buttons = document.getElementsByClassName("focus_on_add_button") window.addEventListener('keydown', (e) => { const dec = () => { count == 0 ? count = 0 : count-- buttons[count].focus() } const inc = () => { count++ buttons[count].focus() } if (e.key == "ArrowUp") { dec() } else if (e.key == "ArrowDown") { inc() } })
·
Juan Pablo Isaza
Relatório
Responde à pergunta