Javascript元素相互阻塞

Javascript elements blocking each other

本文关键字：元素 Javascript      更新时间：2023-09-26

我正在尝试编辑表单的几个元素，但这些元素相互"阻塞"！

<script type="text/javascript">
document.getElementsByClassName("hbspt-form")[0].style.background = "#fffbd5";
document.getElementsByClassName("hbspt-form")[0].style.border= "solid";
document.getElementsByClassName("hbspt-form")[0].style.boxShadow = "10px 20px 30px ";
document.getElementsByClassName("hbspt-form")[0].style.borderColor = "#f7761f";

setTimeout(function(){}, 10);
document.getElementsByClassName("hs_input")[0].style.width="300 px";
document.getElementsByClassName("hs_input")[0].style.background = "#455560";
document.getElementsByClassName("hs_firstname field hs-form-field")[0].style.color = "#fff";
document.getElementsByClassName("hs_firstname field hs-form-field")[0].style.borderColor= "#ffd188";
</script>

谁能告诉我如何解决这个问题？（我试图使用变量来防止这种情况，但它不起作用。

提前感谢！

Javascript setTimeout将一个函数作为其参数，它将在设定的时间过去和等待的时间量之后运行。如下所述：

它

不会阻止它所在的块的执行，相反，它会 在一定间隔后调用其输入函数。

在您的情况下，您应该看到的是所有这些指令立即执行，这意味着您永远不会看到第一行的结果。

要解决此问题，请将要查看的更改移到setTimeout中：

setTimeout(function(){
  document.getElementsByClassName("hs_input")[0].style.width="300 px";
  document.getElementsByClassName("hs_input")[0].style.background = "#455560";
  document.getElementsByClassName("hs_firstname field hs-form-field")[0].style.color = "#fff";
  document.getElementsByClassName("hs_firstname field hs-form-field")[0].style.borderColor= "#ffd188";
  document.getElementsByClassName("hs_firstname field hs-form-field")[0].style.borderColor= "#ffd188";
}, 10);

请参阅脚本的最后两行。您似乎正在尝试两次应用完全相同的代码。我想知道这是不是故意的？而且，您似乎将大括号放在了错误的位置。

document.getElementsByClassName("hs_firstname field hs-form-field")[0].style.borderColor= "#ffd188";
document.getElementsByClassName("hs_firstname field hs-form-field")[0].style.borderColor= "#ffd188";
相关文章：