我如何将 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">

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

        <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" id="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>    

            </div>  

<script>

    var email_val = document.getElementById('email').value;

    document.querySelector("#email").addEventListener("change",setEmail);

    function setEmail(e){   

        try{

            var elem = document.getElementById("razorpay_script");            

            var elem2 = document.querySelector(".razorpay-payment-button");

            document.querySelector("#frm_container").removeChild(elem);  

            document.querySelector("#frm_container").removeChild(elem2);  

        }catch(err){

            console.log(err);

        }

        email_val = e.target.value;

        addScript(email_val);

        //

    }

    function addScript(email_val) {

        var s = document.createElement( 'script' );

        s.setAttribute( 'src', "https://checkout.razorpay.com/v1/checkout.js" );

        s.setAttribute( 'id', "razorpay_script" );

        s.setAttribute( 'data-key', "my key" );

        s.setAttribute( 'data-amount', "100000" );

        s.setAttribute( 'data-buttontext', "Enrol Now to Get 10% Spot Registration Discount" );

        s.setAttribute( 'data-name', "ssss.com" );

        s.setAttribute( 'data-description', "Android Training Courses" );

        s.setAttribute( 'data-image', "https://some.com/itrain/images/logo.png" );

        s.setAttribute( 'data-theme.color', "#3276B1" );

        s.setAttribute( 'data-prefill.email', email_val );

        document.querySelector("#frm_container").appendChild( s );

    }

</script>

<!--  <script

        src="https://checkout.razorpay.com/v1/checkout.js"

        data-key="my key"

        data-amount="100000"

        data-buttontext="Enrol Now to Get 10% Spot Registration Discount"

        data-name="ssss.com"

        data-description="Android Training Courses"

        data-image="https://some.com/itrain/images/logo.png"

        data-theme.color="#3276B1"

        data-prefill.email= email_val

    ></script> -->

                    </form>

                </div>

希望能帮助到你 ：）