ありがとうございます。
色々調査した結果、フォーム送信後ですと「タイムライン」上に文言が表示されてしまうことがわかりました。
「送信前」に対応する必要があり、次のロジックで対応する結論に至りました。
h1は、フォーム上に事前に設置しております(空だとh1が消えるため、全角スペースをとりあえず入れてます)。
*調査用コードです
*lostfocus時に不適切文字をチェックし、送信をブロックする方式にしています。
<script>
window.addEventListener('focusout', (event) => {
if (event.target.name === 'TICKET.content') {
let words = document.getElementsByName('TICKET.content')[0].value;
let NG_WORDS = /アホ|まぬけ|バカ|死ね/g;
const button = document.querySelector(".hs-button");
const obj = document.getElementsByTagName('h1')[0];
if (NG_WORDS.test(words)) {
console.log('不適切!');
// let rep_str = words.replace(NG_WORDS, '**');
// document.getElementsByClassName('hs-button').disabled = true;
// button.style.display ="none";
button.disabled = true;
button.style.pointerEvents = "none";
obj.innerHTML = '<span style="color: #ff0201;">不適切な言葉が入力されております。修正をお願いします。</span>';
// event.target.style.background = 'pink';
// alert('不適切な言葉が含まれております。');
// document.getElementsByName('TICKET.content')[0].value = rep_str;
// event.data.data[3].value = rep_str;
// document.getElementsByName('TICKET.content')[0].value = rep_str;
// document.getElementsByName('TICKET.content')[0] = "";
// return true;
} else {
// button.style.display ="block";
button.disabled = false;
button.style.pointerEvents = "auto";
obj.innerHTML = '';
// obj.innterHTML = '';
// event.target.style.background = '';
}
}
});
</script>
参考になれば幸いです。