【发布时间】：2021-09-10 21:40:44
【问题描述】：
我正在尝试提交使用 JavaScript 添加的输入字段的值，我创建了表单并包含了在表单中添加输入字段的脚本，并且我还添加了一个提交按钮，但是在单击提交之后按钮，输入字段的值没有提交，希望有人帮助我
我包含了完整的源代码，非常感谢
/* sc-component-id: sc-bdVaJa */
.ixTfPP{display:inline-block;}
/* sc-component-id: sc-bwzfXH */
.kJnpoy{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;background-color:white;padding:10px;border-radius:3px;overflow:hidden;}.kJnpoy.is-invalid{border:1px solid #ff3860;}
/* sc-component-id: sc-htpNat */
.dcxtLi{height:1em;}
/* sc-component-id: sc-bxivhb */
.kvysci{position:relative;margin-left:0.5em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:-webkit-transform 0.5s;-webkit-transition:transform 0.5s;transition:transform 0.5s;-webkit-transform:translateX( 0 );-ms-transform:translateX( 0 );transform:translateX( 0 );}.kvysci::after{content:attr(data-max);visibility:hidden;height:0;}.kvysci .credit-card-input{border:0px;position:absolute;width:100%;font-size:1em;}.kvysci .credit-card-input:focus{outline:0px;}.kvysci .zip-input{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
.eGrSDA{position:relative;margin-left:0.5em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:-webkit-transform 0.5s;-webkit-transition:transform 0.5s;transition:transform 0.5s;-webkit-transform:translateX( 4rem );-ms-transform:translateX( 4rem );transform:translateX( 4rem );}.eGrSDA::after{content:attr(data-max);visibility:hidden;height:0;}.eGrSDA .credit-card-input{border:0px;position:absolute;width:100%;font-size:1em;}.eGrSDA .credit-card-input:focus{outline:0px;}.eGrSDA .zip-input{display:none;}
/* sc-component-id: sc-EHOje */
.cesLdd{font-family:'Helvetica Neue',Helvetica,sans-serif;font-size:16px;font-variant:normal;margin:0;padding:20px;-webkit-font-smoothing:antialiased;}</style>
<style type="text/css">.custom-field {
-webkit-box-shadow: 0 1px 3px 0 rgb(212, 212, 212);
box-shadow: 0 1px 3px 0 rgb(212, 212, 212);
border: 3px solid teal;
}
.custom-container {
border: 3px solid pink;
}
.custom-input {
border: 1px solid gray !important;
}
.custom-danger-text {
font-size: 1rem;
border-bottom: 1px solid green;
}<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
</head>
<body>
<form method="post">
<div class="sc-EHOje cesLdd" style="background-color: rgb(240, 240, 240);">
<div class="sc-bdVaJa ixTfPP">
<div class="sc-bwzfXH kJnpoy" id="field-wrapper">
<img class="sc-htpNat dcxtLi" src="data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNTc2IDM3NyIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5wbGFjZWhvbGRlcjwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZGVmcz48L2RlZnM+ICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiAgICAgICAgPGcgaWQ9InBsYWNlaG9sZGVyIj4gICAgICAgICAgICA8cGF0aCBkPSJNNTI3LjkzMzc5MywzNzYuOTk4MjggTDQ4LjA2NjIwNjksMzc2Ljk5ODI4IEMzNS40MjM0ODAzLDM3Ny4xMDM5NjggMjMuMjU2NTg2NCwzNzIuMTg3ODkgMTQuMjQyMzI4MSwzNjMuMzMxNjE4IEM1LjIyODA2OTc1LDM1NC40NzUzNDYgMC4xMDQ5MTcxMDIsMzQyLjQwNDQwNyAwLDMyOS43NzQ0OTQgTDAsNDcuMjI1NDU1NCBDMC4xMDQ5MTcxMDIsMzQuNTk1NTQyNSA1LjIyODA2OTc1LDIyLjUyNDYwNCAxNC4yNDIzMjgxLDEzLjY2ODMzMTkgQzIzLjI1NjU4NjQsNC44MTIwNTk4NSAzNS40MjM0ODAzLC0wLjEwNDAxODI5NiA0OC4wNjYyMDY5LDAuMDAxNjY5NDg2NDYgTDUyNy45MzM3OTMsMC4wMDE2Njk0ODY0NiBDNTQwLjU3NjUyLC0wLjEwNDAxODI5NiA1NTIuNzQzNDE0LDQuODEyMDU5ODUgNTYxLjc1NzY3MiwxMy42NjgzMzE5IEM1NzAuNzcxOTMsMjIuNTI0NjA0IDU3NS44OTUwODMsMzQuNTk1NTQyNSA1NzYsNDcuMjI1NDU1NCBMNTc2LDMyOS45NzI5MTMgQzU3NS42NzI3ODYsMzU2LjE5NTY2MyA1NTQuMTg0MjczLDM3Ny4yMTg4NTcgNTI3LjkzMzc5MywzNzYuOTk4MjggWiIgaWQ9InNoYXBlIiBmaWxsPSIjRThFQkVFIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4gICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiBzdHJva2U9IiM3NTc1NzUiIHN0cm9rZS13aWR0aD0iMjAiIHg9IjQxOCIgeT0iNTgiIHdpZHRoPSI5MSIgaGVpZ2h0PSI2MyIgcng9IjMwIj48L3JlY3Q+ICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZS0yIiBmaWxsPSIjNzU3NTc1IiB4PSI1MyIgeT0iMjA4IiB3aWR0aD0iMTA3IiBoZWlnaHQ9IjQwIiByeD0iOCI+PC9yZWN0PiAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUtMiIgZmlsbD0iIzc1NzU3NSIgeD0iNDEzIiB5PSIyMDgiIHdpZHRoPSIxMDciIGhlaWdodD0iNDAiIHJ4PSI4Ij48L3JlY3Q+ICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZS0yIiBmaWxsPSIjNzU3NTc1IiB4PSIyOTMiIHk9IjIwOCIgd2lkdGg9IjEwNyIgaGVpZ2h0PSI0MCIgcng9IjgiPjwvcmVjdD4gICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlLTIiIGZpbGw9IiM3NTc1NzUiIHg9IjE3MyIgeT0iMjA4IiB3aWR0aD0iMTA3IiBoZWlnaHQ9IjQwIiByeD0iOCI+PC9yZWN0PiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+">
<label class="sc-bxivhb kvysci" data-max="9999 9999 9999 9999 9999">
<input id="card-number" autocomplete="cc-number" class="credit-card-input " placeholder="Card number" type="text">
</label>
<label class="sc-bxivhb eGrSDA" data-max="MM / YY 9">
<input id="card-expiry" autocomplete="cc-exp" class="credit-card-input " placeholder="MM/YY" type="text">
</label>
<label class="sc-bxivhb eGrSDA" data-max="99999">
<input id="cvc" autocomplete="off" class="credit-card-input " placeholder="CVC" type="text">
</label>
<label class="sc-bxivhb eGrSDA" data-max="999999">
<input id="zip" class="credit-card-input zip-input " placeholder="Zip" type="text">
</label>
</div>
</div>
</div>
</div>
<input type="submit">
</form>
</body>
</html>【问题讨论】：
-
您好，但您的查询不清楚。您要将数据提交到哪里？
-
home.php ，我编辑了帖子 - 谢谢
-
表单似乎没有包含任何字段...您可以在生成字段的位置发布代码吗？
-
输入名称属性在哪里？那是你的问题
-
感谢编辑。正如@epascarello 推测的那样，
input元素需要有一个name属性。这是发送请求时服务器识别它们的方式。如果您添加该属性，则请求应该可以正常运行。
标签： javascript html jquery