Untuk beberapa alasan, kode sederhana ini tidak mencentang kotak centang:

<!DOCTYPE html>
<html>
<body>

<p>Automatically tick the box</p>

<form>
<div id='checkingTheBox'>
    <div class='someValue'>
        <input type="checkbox" name="checkingTheBox">
    </div>
</div>
</form>

<script type="text/javascript">

  document.getElementById("checkingTheBox").click();

</script>


</body>
</html>

Namun, saat menghapus tag div, itu berfungsi dengan baik. Apakah ada alasan mengapa ini tidak berfungsi seperti yang ditunjukkan, dan ada saran untuk membuat javascript mengklik elemen dengan sukses tanpa mengubah struktur HTML?

Sunting: Saya mencoba menggunakan id alih-alih name di dalam tag input. Itu juga tidak berhasil.

-1
n1234 27 Mei 2021, 11:10

2 jawaban

Jawaban Terbaik

Anda tidak boleh memiliki dua atau lebih elemen pada halaman dengan id yang sama. Tag id harus unik. Anda juga tidak dapat menggunakan tag name sebagai tag id. Itu tidak sama. Inilah contoh kode yang berfungsi seperti yang Anda inginkan:

<!DOCTYPE html>
<html>
<body>

<p>Automatically tick the box</p>

<form>
<div>
    <div class='someValue'>
        <input type="checkbox" id="checkingTheBox">
    </div>
</div>
</form>

<script type="text/javascript">

  document.getElementById("checkingTheBox").click();

</script>


</body>
</html>

EDIT: Ini bekerja tetapi tidak masuk akal untuk melakukan itu. Anda cukup menggunakan tag checked sederhana di kotak centang Anda agar dapat dicentang secara default. Berikut ini contohnya:

<input type="checkbox" id="checkingTheBox" checked>
1
blazej 27 Mei 2021, 08:31

Anda memilih div dan ingin mengklik fungsi di dalamnya anak dalam jadi coba skrip ini yang akan memilih anak dalam dari yang Anda pilih ini dan panggil fungsi klik pada anak itu

const div = document.getElementById('checkingTheBox');
div.firstElementChild.firstElementChild.click();
-1
Saleh Majeed 27 Mei 2021, 08:50