在表单标签中使用jquery动态附加脚本标签不起作用答案

【问题标题】：append Script tag dynamically using jquery in a form tag not working在表单标签中使用jquery动态附加脚本标签不起作用
【发布时间】：2023-03-30 18:31:01
【问题描述】：

我正在编写添加支付集成的代码。我的任务是通过 javascript 或 jQuery 动态添加脚本。

当我在表单标签中添加脚本标签时

var form_tag = $('<form></form>')
$(form_tag).attr('method' , 'POST')
$(form_tag).attr('action' , '')

var script_tag = document.createElement('script')
$(script_tag).attr(
    {
        type : 'text/javascript',
        src : 'https://checkout.razorpay.com/v1/checkout.js',
        'data-key' : 'my_razorpay secret key (absolutly correct)',
        'data-amount' : 7200,
        'data-currency' : 'USD',
        'data-buttontext':'Pay With Razorpay',
        'data-name':'Pro Subscription',
        'data-description' : 'Here will be the Description',
        'data-image' :  'Image link to show',
        'data-prefill.name' : 'myName',
        'data-prefill.email' : 'mymail@gmail.com',
        'data-theme.color' : '#F37254'
    }
)

$(script_tag).attr('data-order_id' , 'order_id(which is absolutly correct)')
$(form_tag ').append(script_tag)

当我将脚本标签附加到表单标签时，它确实会附加并显示在元素 DOM (chrome) 中，但不起作用，但是当我通过 Chrome Element DOM 复制这个标签，它运行得很好。

任何人都可以快速帮助我

提前致谢

【问题讨论】：

为什么用'cdn'标记？
我永远不会在 JS 中结帐，因为客户总是可以更改价格。相反，您应该使用 PHP 或其他东西来结帐，并仅将产品 ID 发送给它，这样服务器就可以从数据库中获取价格并且无法更改价格。

标签： javascript jquery append

【解决方案1】：

我的问题是通过在将脚本标签附加到表单标签后添加 src 属性来解决的。

当我遇到错误之前发生了什么。

我在添加其他数据属性之前添加了 src。脚本已加载但不显示任何响应，因为脚本需要数据属性来执行操作，当找不到属性时不显示响应。

解决方案

我之前添加了所有数据属性并将脚本标签附加到表单标签中。之后我添加了 src 属性，这样做解决了我的问题

【讨论】：