Je peux refaire la même erreur parce que je ne comprends pas grand-chose maintenant. Gardez un dossier pour pouvoir regarder en arrière et le vérifier à ce moment-là.
Lors de l'implémentation de la fonction de suppression avec des rails, je souhaite afficher une boîte de dialogue de confirmation avant de supprimer, donc je l'écris dans le fichier Javascript.
html.erb
<%= link_to 'Effacer', hoge_path(hoge.id), class: 'delete-btn', method: :delete %>
javascript
function check() {
const btn = document.getElementsByClassName('delete-btn');
btn.addEventListener('click', () => {
window.confirm('Effectuer une suppression')
})
};
J'essaye de cliquer sur le bouton de suppression, mais la boîte de dialogue n'apparaît pas et la suppression est exécutée. Il se recharge et essaie à nouveau, mais il est supprimé sans rien.
Modification de la description du fichier html comme suit
html.erb
<%= link_to 'Effacer', hoge_path(hoge.id), class: 'delete-btn', method: :delete, data: { confirm: 'Effacerを実行します。よろしければOKをクリックしてください。' } %>
Après vérification, on dit qu'une boîte de dialogue s'affichera si vous écrivez `data: {confirm:" words to be displayed "}`
dans link_to
. Résolu pour afficher la boîte de dialogue.
Alors que faire si vous voulez utiliser addEventListener
dans un fichier JavaScript?
querySelectorAll``` → Utilisez la fonction
forEach`` pour l'élément acquisLa fonction foreach '' est une méthode de l'objet NodeList et NodeList est la valeur de retour de
querySelectorAll ''. Par conséquent, utilisez querySelectorAll '' au lieu de
getElementsByClassName '' pour obtenir les éléments.
À propos, la valeur de retour de
getElementsByClassName est` `` HTMLCollection
.
Je ne suis toujours pas très familier avec cela, et comme j'écris en reliant ce que j'ai recherché pour le moment, il y a beaucoup de parties que je ne comprends pas. J'ai senti que je devais étudier pour approfondir ma compréhension.
Recommended Posts