使用javascript

时间:2018-08-22 14:22:39

标签: javascript html forms customization

问题:

在Saas环境中工作,该环境以需要更改的方式处理表单。它是软件即服务,因此无法在系统范围内进行独特的更改。

尝试的解决方案:

尝试使用系统添加到页面标题区域的Javascript来更改表单ID的值,以便在提交表单时包含更改后的值。

代码: HTML

                <div class="form-group " data-field="how_to_apply">
            <label class="form-label">How to Apply </label>


<div id="application-settings" class="form--move-left clearfix row">
    <div class="form-group form-group__half">
        <input id="via-email" name="ha" value="1" checked="checked" onclick="displayInput(false, 'how_to_apply_1');" type="radio" />
        <label for="via-email" class="form-label">
            By Email<br/>
        </label>
        <input value="systemapplied@emailaddress.com" class="form-control"  name="how_to_apply"  id="how_to_apply_1" type="email" />
    </div>
    <div class="form-group form-group__half">
        <input id="via-site" name="ha" value="2"  onclick="displayInput(false, 'how_to_apply_2');" type="radio" />
        <label for="via-site" class="form-label">
            By URL
        </label>
        <input value="" class="form-control" name="how_to_apply" id="how_to_apply_2" disabled="disabled" type="url" required placeholder="e.g. http://www.yourwebsite.com"/>
    </div>
</div>

试图更改分配给how_to_apply_1 ID的电子邮件地址

使用的Javascript

  document.getElementById("how_to_apply_1").value = "new@emailaddress.com";

重要的是要补充一点,这可以在CodePen区域中按预期方式运行,但不能在实时站点上运行,所以我的假设是在我看不见的某个地方覆盖了某些内容,或者我需要使用其他方式来强制改变,我不知道。任何建议或帮助将不胜感激

预先感谢...

1 个答案:

答案 0 :(得分:0)

您需要在DOM准备好后运行脚本。您可以将脚本包装在DOMContentLoaded事件中,如下所示:

document.addEventListener("DOMContentLoaded", function(event) {
    document.getElementById("how_to_apply_1").value = "new@emailaddress.com";
});