首页 > 解决方案 > 无法使用 javascript 提交表单

问题描述

当我尝试提交此表单时,我收到 submit is not a function。

有人建议,如果提交按钮被命名为提交,它将覆盖提交()。在原始版本中,没有为提交按钮分配名称。我将其更改为 name='notSubmit' 但我仍然收到相同的错误。

var desktop=true;
           
        
            function nextPage(){
                
                var minCap = document.getElementById('minCap');
                minCap.style.display='none';
               
               
                var top = document.getElementById('top');
                top.style.display='none';
                var middle = document.getElementById('middle');
                middle.style.display='none';
                var next = document.getElementById('next');
                next.style.display='none';
                
                var bottom = document.getElementById('bottom');
                bottom.style.display='block';
                var back = document.getElementById('back');
                back.style.display='block';
            }
            function backPage(){
                
                var minCap = document.getElementById('minCap');
                minCap.style.display='block';
                
                var top = document.getElementById('top');
                top.style.display='block';
                var middle = document.getElementById('middle');
                middle.style.display='block';
                var next = document.getElementById('next');
                next.style.display='block';
                
                var bottom = document.getElementById('bottom');
                bottom.style.display='none';
                var back = document.getElementById('back');
                back.style.display='none';
                
            }
            function mySubmit(){
                event.preventDefault();
                
                console.log("destop = " + desktop);
                
                var fname = document.getElementById('fname').value;
                var lname = document.getElementById('lname').value;
                var email = document.getElementById('email').value;
                
                var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
                if(!email.match(mailformat)){
                    var em = document.getElementById('email');
                    em.value = "";
                    email="";
                }
                
                if(fname == "" || lname == "" || email == ""){
                    alert("Please enter name and email");
                    if(!desktop)backPage();
                }else{
                    var myForm = document.getElementById('myForm');
                    console.log(myForm);
                    myForm.submit();
                }
            }
<form action='getInvolvedCtrl.php' method='POST' id='myForm' novalidate onsubmit="mySubmit()">
    <span class='majCap'>Get Involved</span>
    <div id='all'>
        <span id='minCap' class='minCap'>Enter your details below</span>
        <div id='top'>
            <div class='columns'>
                <input class='detailsC' type="text"  name="fname" placeholder="First Name" value='Bob' id='fname'>
                <input class='detailsC' type="text"  name="lname" placeholder="Last Name" value='Cross' id='lname'>
                <input class='detailsC' type="email" name="email" placeholder="Email..."  value='bc@gml.com' id='email'>
                               
                <div class='rowsDet'>
                    <span class='detailsR'><input  type="checkbox" name="wres">Weston Resident</span>
                    <span class='detailsR'><input  type="checkbox" name="news">Quarterly Newsletter</span>
                </div>
            </div>
            <div class='spacer'></div>
        </div>
        <div id='middle'>
            <span class="minCap" >Areas of Interests</span>
            <div class='rowsInt mobileOnly'>
            <div class="columns">
                <span><input type="checkbox" name="energy-int">Energy</span>
                <span><input type="checkbox" name="recycling-int">Recycling</span>
                <span><input type="checkbox" name="composting-int">Composting</span>
                <span><input type="checkbox" name="transport-int">Transportation</span>
            </div>
            <div class="columns">
                <span><input type="checkbox" name="climate-int">Climate</span>
                <span><input type="checkbox" name="trees-int">Trees</span>
                <span><input type="checkbox" name="pollinators-int">Pollinators</span>
                <span><input type="checkbox" name="water-int">Water</span>
                <span><input type="checkbox" name="other-int">Other</span>
            </div>
        </div>
        <div class='desktopOnly rowsInt'>
            <div class="columns">
                <span><input type="checkbox" name="energy-int">Energy</span>
                <span><input type="checkbox" name="recycling-int">Recycling</span>
                <span><input type="checkbox" name="composting-int">Composting</span>
            </div>
            <div class="columns">
                <span><input type="checkbox" name="transport-int">Transportation</span>
                <span><input type="checkbox" name="climate-int">Climate</span>
                <span><input type="checkbox" name="trees-int">Trees</span>
            </div>
            <div class="columns">
                <span><input type="checkbox" name="pollinators-int">Pollinators</span>
                <span><input type="checkbox" name="water-int">Water</span>
                <span><input type="checkbox" name="other-int">Other</span>
            </div>
        </div>
    </div>
    <button id='next' class='mobileOnly' type='button' onclick="nextPage()">next</button>
    <div id='bottom'>
        <span class='minCap' >Request Campaign Information:</span>
        <div class='rowsCam'>
            <div class="columns">
                <span><input type="checkbox" name="cleanup-cpg">Town Cleanup</span>
                <span><input type="checkbox" name="pollinators-cpg">Pollinators</span>
            </div>
            <div class="columns">
                <span><input type="checkbox" name="gas-cpg">Gas Leaks</span>
                <span><input type="checkbox" name="cca-cpg">CCA</span>
            </div>
        </div>
        <div class='spacer2'></div>
        <input id='submit' type="submit" value="SUBMIT" name='notSubmit'>
    </div>
    <button id='back' class='mobileOnly' type='button' onclick="backPage()">back</button>
    </div>
</form>

标签: javascriptformsform-submit

解决方案


推荐阅读