使用URL变量预填充HTML5表单

时间:2015-05-14 06:41:56

标签: html html5

我有以下HTML代码:

<section id="two" class="wrapper alt style2">
<section dir="rtl">
    <center>
        <h1> מילוי פרטים אישיים לתעודת אחריות</h1>
    </center>
    <br>
    <!-->
    <form method="post" action="#">
        <!-->
        <form id="frmcontainer6" method="post" enctype="application/x-www-form-urlencoded" action="https://web.mxradon.com/t/FormTracker.aspx" onsubmit="return lpContentGrabber('frmcontainer6');">
            <!-->
            <form action="mailto:graphics@emka.co.il" method="post">
                <!-->
                <div class="row uniform">
                    <div class="6u 12u$(xsmall)">
                        <input type="text" id="EfullName" name="EfullName" maxlength="100" value="" placeholder="שם מלא" autocomplete="off" />
                    </div>
                    <div class="6u$ 12u$(xsmall)">
                        <input type="email" name="email" id="email" value="" placeholder="Email" required />
                    </div>
                    <div class="6u 12u$(xsmall)">
                        <input type="text" name="PhoneNu" id="PhoneNu" value="" placeholder="מספר טלפון" required />
                    </div>
                    <div class="6u$ 12u$(xsmall)">
                        <input type="text" name="CAdress" id="CAdress" value="" placeholder="כתובת" required />
                    </div>
                    <br>
                    <div class="6u 12u$(xsmall)">
                        <input type="text" id="Pmodel" name="Pmodel" maxlength="100" value="" autocomplete="off">
                    </div>
                    <div class="6u$ 12u$(xsmall)">
                        <input type="text" name="SerialNu" value="SN12-8486-EF19-8541" id="SerialNu" readonly/>
                    </div>
                    <div class="12u$">
                        <textarea name="message" id="message" placeholder="הערות נוספות" rows="6"></textarea>
                    </div>
                    <div class="image center">
                        <input type="checkbox" id="demo-copy" name="demo-copy">
                        <label for="demo-copy">סמן לקבלת מבצעים והנחות למייל</label>
                    </div>
                    <div class="12u$">
                        <ul class="actions">
                            <center>
                                <li>
                                    <input type="submit" value="שלח טופס" class="special" />
                                </li>
                                <li>
                                    <button type="reset" value="Reset">נקה טופס</button>
                                </li>
                            </center>
                        </ul>
                    </div>
                </div>
            </form>
</section>

我正在尝试使用类似

之类的内容按网址预填Pmodel
www.ee.com?Pmodel=123456

但它不起作用。

我做错了什么?

1 个答案:

答案 0 :(得分:1)

您只是将其作为网址参数插入。为了预先填充您需要从URL中检索它的值,并将其作为Pmodel元素的值插入。

您可以在服务器端(例如PHP,Java,取决于您的服务器)或在页面加载后使用JavaScript在客户端执行此操作。

例如(JavaScript)在页面末尾插入此脚本:

<script type="text/javascript">
    //get all URL parameters
    var parameters = window.location.search.substring(1).split("&");
    var splitParam, value;
    //cycle through them and find the correct one
    for(var i=0; i<parameters.length; i++){
        splitParam = parameters[i].split("=");
        if(splitParam[0]=="Pmodel"){
            //get its value
            value = splitParam[1];
            break;
        }
    }
    if(value){
        //set the input value
        document.getElementById("Pmodel").value = value;
    }
</script>

填写示例:jsFiddle