我如何将 html 输入数据传递给 javascript

Question

我想将输入数据解析为 razorpay 脚本。我是 php 新手，因为基本上我是移动应用程序开发人员。这是我第一次尝试 php。我也尝试过发布方法。我不知道我在这段代码中哪里出错了。我想将电子邮件传递给 razorpay 脚本字段

 <div class="form-filde">

                    <form action="contact_us.php" method="post" >

                        <div class="row">

                            <div class="col-sm-6">

                                <div class="input-box">

                                    <input type="text" placeholder="Name" data-validation="required" name="name" >

                                </div>

                                <div class="input-box">

                                    <input type="text" placeholder="Email" data-validation="required" name="email" >

                                </div>

                                <div class="input-box">

                                    <input type="text" placeholder="Subject" data-validation="required" name="subject" >

                                </div>

                            </div>

                            <div class="col-sm-6">

                                <div class="input-box">

                                    <textarea placeholder="Message"  name="message"></textarea>

                                </div>

                            </div>

                            <div class="col-sm-12">

                                <div class="submit-box">

                                    <input type="submit" value="SEND" class="btn">

                                                </div>   

                                </div>    

有人帮助我解决这个问题。

Answer 1

改变 ：<input type="text" placeholder="Email" data-validation="required" name="email" >和<input type="text" placeholder="Email" data-validation="required" name="email" id="email" >更新 -尝试以下之一 -<div class="form-filde">&nbsp; &nbsp; <form action="contact_us.php" method="post" id="frm_container">&nbsp; &nbsp; &nbsp; &nbsp; <div class="row">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col-sm-6">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="input-box">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" placeholder="Name" data-validation="required" name="name" >&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="input-box">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" placeholder="Email" data-validation="required" name="email" id="email">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="input-box">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" placeholder="Subject" data-validation="required" name="subject" >&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col-sm-6">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="input-box">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <textarea placeholder="Message"&nbsp; name="message"></textarea>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col-sm-12">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="submit-box">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<input type="submit" value="SEND" class="btn">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp;&nbsp;<script>&nbsp; &nbsp; var email_val = document.getElementById('email').value;&nbsp; &nbsp; document.querySelector("#email").addEventListener("change",setEmail);&nbsp; &nbsp; function setEmail(e){&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; try{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var elem = document.getElementById("razorpay_script");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var elem2 = document.querySelector(".razorpay-payment-button");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.querySelector("#frm_container").removeChild(elem);&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.querySelector("#frm_container").removeChild(elem2);&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; }catch(err){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(err);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; email_val = e.target.value;&nbsp; &nbsp; &nbsp; &nbsp; addScript(email_val);&nbsp; &nbsp; &nbsp; &nbsp; //&nbsp; &nbsp; }&nbsp; &nbsp; function addScript(email_val) {&nbsp; &nbsp; &nbsp; &nbsp; var s = document.createElement( 'script' );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'src', "https://checkout.razorpay.com/v1/checkout.js" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'id', "razorpay_script" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-key', "my key" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-amount', "100000" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-buttontext', "Enrol Now to Get 10% Spot Registration Discount" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-name', "ssss.com" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-description', "Android Training Courses" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-image', "https://some.com/itrain/images/logo.png" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-theme.color', "#3276B1" );&nbsp; &nbsp; &nbsp; &nbsp; s.setAttribute( 'data-prefill.email', email_val );&nbsp; &nbsp; &nbsp; &nbsp; document.querySelector("#frm_container").appendChild( s );&nbsp; &nbsp; }</script><!--&nbsp; <script&nbsp; &nbsp; &nbsp; &nbsp; src="https://checkout.razorpay.com/v1/checkout.js"&nbsp; &nbsp; &nbsp; &nbsp; data-key="my key"&nbsp; &nbsp; &nbsp; &nbsp; data-amount="100000"&nbsp; &nbsp; &nbsp; &nbsp; data-buttontext="Enrol Now to Get 10% Spot Registration Discount"&nbsp; &nbsp; &nbsp; &nbsp; data-name="ssss.com"&nbsp; &nbsp; &nbsp; &nbsp; data-description="Android Training Courses"&nbsp; &nbsp; &nbsp; &nbsp; data-image="https://some.com/itrain/images/logo.png"&nbsp; &nbsp; &nbsp; &nbsp; data-theme.color="#3276B1"&nbsp; &nbsp; &nbsp; &nbsp; data-prefill.email= email_val&nbsp; &nbsp; ></script> -->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </form>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>希望能帮助到你 ：）