Question

我正在尝试从页面上的现有javascript表单小部件中覆盖2个属性，但不确定如何操作：

我想在提交表单时重定向到另一个URL。
提交表单时，我需要使用id ='prospects_referral_type'将数据点推送到最终系统

此处是表单窗口小部件当前所在的网站：https://jabzboxing.fitness/arcadia

这是小部件的脚本：

<script src="https://widgets.healcode.com/javascripts/healcode.js" type="text/javascript"></script>

<healcode-widget data-type="prospects" data-widget-partner="object" data-widget-id="8423870a150" data-widget-version="0"></healcode-widget>

这是使用Tamb代码的完整实现的简化版本，但仍无法使重定向正常工作：

<html>
<head>
<meta charset="utf-8">

<script> 
$('healcode-widget').submit((e)=>{
  e.preventDefault();
  myAjaxPost();

window.location.replace("https://jabzboxing.fitness/thankyou");

})
</script>

</head>
<body>

<script src="https://widgets.healcode.com/javascripts/healcode.js" type="text/javascript"></script>

<healcode-widget data-type="prospects" data-widget-partner="object" data-widget-id="8423870a150" data-widget-version="0"></healcode-widget>

</body>
</html>

Answer 1

我想这就是你要的。

要更新表单的发布位置：

jQuery('form[id^=prospect_form').attr('action', 'http://stackoverflow.com')

要添加其他字段：

jQuery('form[id^=prospect_form').append('<input id="prospects_referral_type" type="hidden"/>')

请记住，此代码必须在加载表单后运行，但不必提交。

Answer 2

所以有很多方法可以做到这一点：

客户端：

通过AJAX提交表单（注意：也有很多方法可以这样做）。查找您希望支持的最旧的浏览器。如果jQuery很好，请使用其ajax方法并在表单提交时提交到适当的端点。

$('form').submit((e)=>{
  e.preventDefault();
  myAjaxPost();

//on the .success method of the ajax POST you can simply do one of these

// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");

// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";

})

服务器端：

处理后端的帖子，并在成功后简单地重新路由。考虑到您的后端可能是.NET，Node，PHP，这可以采取多种形式。 Idk。

如何覆盖JavaScript表单小部件的属性

2 个答案: