更新外部加载的表单中的INPUT值不起作用

Question

这里完全是编程新手 - 我对 javascript 不太了解，从大学开始（大约 10 年前）就不再编程了 - 试图解决我网站上的一个特定问题。

我正在使用 CRM Bitrix24，并且我的网站上放置了该 CRM 的取消订阅表格。我需要按照从 URL 参数加载电子邮件的方式设置表单。

我只需加载输入并设置

input.value = "email from URL"

即可完成此操作。我的问题是表单有某种验证，即使输入字段中填写了文本，表单也会给我错误：Field is required.

此处截图：https://ibb.co/Ns33GVN

外部表单的代码如下：

<script data-b24-form="inline/120/8y7xg2" data-skip-moving="true">(function(w,d,u){var s=d.createElement('script');s.async=true;s.src=u+'?'+(Date.now()/180000|0);var h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(window,document,'https://cdn.bitrix24.com/b7014957/crm/form/loader_120.js');</script>

我的JS：

function emailPopup(){
var params = new window.URLSearchParams(window.location.search);
var email = params.get('email');

    const emailCollection = document.getElementsByName("email");
    for (let i = 0; i < emailCollection.length; i++) {
      if (emailCollection[i].name == "email") {
          //emailCollection[i].focus();
          emailCollection[i].value = email;
      }
    }
} window.addEventListener('load', function () {
 emailPopup();
})

我试图了解验证是如何完成的，但没有成功。该字段具有自动完成=是的功能，因此一旦提交，下次就不会出现错误，但表单会与第一次尝试提交的电子邮件一起发送，即使在点击“提交”按钮时显示另一个电子邮件。看起来它只显示 URL 参数中的电子邮件地址，但实际上它使用了错误的值，甚至是空的（第一次尝试）或错误的（第二次尝试）。

有没有办法强制字段假装它已被用户修改？有什么想法吗？

我尝试在 jsfiddle 中设置类似的环境：https://jsfiddle.net/e395wf6m/17/

非常感谢您的反馈！

Answer 1

我有一个理论，它似乎是正确的，因为我在你的小提琴中测试了它。

我的理论是验证是通过触发更改事件来完成的，因此您需要触发它。幸运的是 JavaScript 让我们做到了：

if (emailCollection[i].name == "email") {
      //emailCollection[i].focus();
      emailCollection[i].value = email;

      // to trigger the change event
      emailCollection[i].dispatchEvent((new Event('change'))); 
  }

正如我所说，当我在你的小提琴上测试它时它起作用了，让我知道它是否适合你=]

Answer 2

非常感谢，对我来说，以下方法有效：

$('div.b24-form-control-label:contains("Input Name")').prev()[0].dispatchEvent((new Event('focus'))); 

你的回答让我省去了很多麻烦。谢谢。