第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題，去搜搜看，總會(huì)有你想問(wèn)的

如何使用js將表單數(shù)據(jù)發(fā)送到isset函數(shù)中

如何使用js將表單數(shù)據(jù)發(fā)送到isset函數(shù)中

PHP
當(dāng)年話下 2023-08-26 17:40:48
如何以多步驟形式提交表單并插入數(shù)據(jù)庫(kù)我制作了一個(gè)類(lèi)似于多步驟上一個(gè)下一個(gè)按鈕的表單，也是使用js制作的?，F(xiàn)在我想提交表單并在 php 中發(fā)送到數(shù)據(jù)庫(kù)表單 HTML：<form action="method.php" method="post" name="htlregistration_F" id="htlregistration_F" enctype="multipart/form-data" >    <section id="form_part1" class="tab" >        <h3  class="bodytext bodyheading " ><strong>Applicant Details</strong></h3>        <label class="bodytext">Applicant First Name<span class="redtext"> *</span>            <input name="appfirstname_f"  type="text" id="appfirstname_f" class="input form-control" maxlength="25" required>&nbsp;            <span class="redtext" id="errorFirst" >(Max length 25 chars)</span>        </label>    </section>    <section id="form_part4" class="tab " >        <h3  class="bodytext bodyheading " ><strong>Contact Details</strong></h3>        <label class="bodytext" >Phone (Mobile)<span class="redtext" id="errorMobile"> *</span>            <input name="phmob_f" type="text" id="phmob_f"  class="input form-control" minlength="10" maxlength="10" required="">&nbsp;            <span class="redtext">(Max length 10 chars)</span>        </label>    </section>    <div style="overflow:auto;">        <div style="float:right;">            <button type="button" id="prevBtn" onclick="nextPrev(-1)">&laquo; Previous</button>            <button type="button" id="nextBtn" name="licensesubmit" onclick="nextPrev(1)">&raquo; Next </button>        </div>    </div>        </form>我的頁(yè)面腳本<script>    var currentTab = 0; // Current tab is set to be the first tab (0)    showTab(currentTab); // Display the current tab    function showTab(n) {        // This function will display the specified tab of the form...        var x = document.getElementsByClassName("tab");        x[n].style.display = "block";        //... and fix the Previous/Next buttons:        if (n == 0) {            document.getElementById("prevBtn").style.display = "none";        } else {            document.getElementById("prevBtn").style.display = "inline";        }
查看完整描述

1 回答

?
Smart貓小萌

TA貢獻(xiàn)1911條經(jīng)驗(yàn) 獲得超7個(gè)贊

本質(zhì)上，javascriptshowTab函數(shù)是相同的，但我修改為使用類(lèi)名。當(dāng)您達(dá)到條件時(shí)，將按鈕的 按鈕從常規(guī)按鈕n == ( tabs.length - 1 )更改為 - 如果用戶(hù)向后移動(dòng)條件發(fā)生變化，則將按鈕再次更改回常規(guī)按鈕。typebuttonsubmit

<?php

    if( $_SERVER['REQUEST_METHOD']=='POST' ){

        /* to emulate `method.php` ... process FORM submission... */

        

        

        if( isset( $_POST['licensesubmit'] ) ){

            $_POST['banana']='curvy yellow fruit';  #this will only be visible IF isset( $_POST['licensesubmit'] ) is TRUE

        }

        

        

        exit( sprintf( '<pre>%s</pre>',print_r($_POST,true) ) );

    }

?>

<!DOCTYPE html>

<html>

    <head>

        <meta charset='utf-8' />

        <title>Multi-stage form</title>

        <style>

            body *{font-family:monospace;box-sizing:border-box;}

            section{border:1px solid gray;margin:1rem;width:calc( 100% - calc( 4rem + 2px ) );padding:1rem }

            .tab{display:none;}

            .visible{display:block;}

            .stage1{background:whitesmoke;}

            .stage2{background:rgba(0,255,0,0.1);}

            .stage3{background:rgba(0,0,255,0.1);}

            .stage4{background:rgba(255,0,0,0.1);}

        </style>

        <script>


            function showTab(n) {

                let prev=document.getElementById('prevBtn');

                let next=document.getElementById('nextBtn');

                

                let tabs = document.getElementsByClassName('tab');

                    Array.from( tabs ).forEach( tab=>{

                        if( tab.classList.contains('visible') )tab.classList.remove('visible');

                    })

                    tabs[ n ].classList.add('visible');

                    

                    

                prev.style.display=( n==0 ) ? 'none' : 'inline';


                

                if( n == ( tabs.length - 1 ) ) {

                    next.innerHTML = 'Submit';

                    next.type='submit';

                } else {

                    next.innerHTML = 'Next';

                    next.type='button'

                }

            };

            function nextPrev(i){

                currentTab=currentTab + i;

                showTab( currentTab );

            };

            

            let currentTab=0;

            

            document.addEventListener('DOMContentLoaded',()=>{

                showTab( currentTab );              

            });

        </script>

    </head>

    <body>

        <form method='post' name='htlregistration_F'><!-- removed action so that this form POSTS to the same page for demonstration -->

        

            <section id='form_part1' class='tab stage1'>

                <h3  class='bodytext bodyheading ' ><strong>Applicant Details</strong></h3>

                <label class='bodytext'>Applicant First Name<span class='redtext'> *</span>

                    <input name='appfirstname_f'  type='text' class='input form-control' maxlength='25' required />&nbsp;

                    <span class='redtext' id='errorFirst' >(Max length 25 chars)</span>

                </label>

            </section>

            

            <section id='form_part2' class='tab stage2'>

                <h3  class='bodytext bodyheading ' ><strong>Applicant Juggling ability</strong></h3>

                <label class='bodytext'>Can you juggle hedgehogs?<span class='redtext'> *</span>

                    <input name='appjuggle'  type='text' class='input form-control' maxlength='25' required />&nbsp;

                    <span class='redtext' >(Max length 25 chars)</span>

                </label>

            </section>

            

            <section id='form_part3' class='tab stage3'>

                <h3  class='bodytext bodyheading ' ><strong>Applicant ESP Level</strong></h3>

                <label class='bodytext'>ESP ability<span class='redtext'> *</span>

                    <input name='appesp'  type='text' class='input form-control' maxlength='25' required />&nbsp;

                    <span class='redtext' >(Max length 25 chars)</span>

                </label>

            </section>

            

            <section id='form_part4' class='tab stage4'>

                <h3  class='bodytext bodyheading ' ><strong>Contact Details</strong></h3>

                <label class='bodytext' >Phone (Mobile)<span class='redtext' id='errorMobile'> *</span>

                    <input name='phmob_f' type='text' class='input form-control' minlength='10' maxlength='10' required />&nbsp;

                    <span class='redtext'>(Max length 10 chars)</span>

                </label>

            </section>

            

            

            

            

            <div style='overflow:auto;'>

                <div style='float:right;'>

                    <button type='button' id='prevBtn' onclick='nextPrev(-1)'>&laquo; Previous</button>

                    <button type='button' id='nextBtn' name='licensesubmit' onclick='nextPrev(1)'>&raquo; Next </button>

                </div>

            </div>        

        </form>

        

    </body>

</html>

輸出類(lèi)似于：


Array

(

    [appfirstname_f] => geronimo

    [appjuggle] => fluently

    [appesp] => none

    [phmob_f] => 0141 353 3

    [licensesubmit] => 

    [banana] => curvy yellow fruit

)




查看完整回答
反對(duì) 回復(fù) 2023-08-26
  • 1 回答
  • 0 關(guān)注
  • 145 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢(xún)優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)