当我尝试使用 emailjs 时出现 thsi 错误：Uncaught ReferenceError: sendMail is not defined emailjs

Question

i have a problem with the send email im using emailjs to send email but its not working note its the first time im using javascript to send email i tried once with python and i manged with the help of stackover flow of course

js

function sendMail(params){
        var tempparams ={
            from_name:document.getElementById("InputName").value,
            last_name:document.getElementById("InputLastname").value,
            pick_up:document.getElementById("shippingOption1").value,
            delivery:document.getElementById("shippingOption2").value,
            addressone:document.getElementById("address").value,
            addresstwo:document.getElementById("address2").value,
            total:document.getElementById("total")
            

            
        }
        emailjs.send(service_mvduipb,template_8cr649h,tempParams)
        .then(function(res){
              console.log("success",res.status)
              })
    }
    
}

html

 <section id="sectionone"
form method = "post"         class ="hidesection"  >
    
     <div class="col-sm-6 col-lg-6 mb-3">
                    <div class="row">
                        <div class="col-md-12 col-lg-12">
                            <table class="table">
                                <thead>
                                <tr>
                                    <th>Shipping Method</th>
                                    <th>Name</th>
                                    <th>Adress</th>
                                                                    </tr>
                            </thead>
                                
                                <tbody>
                                <tr>
                                    <td>
                                        
                                    <div class="custom-control custom-radio">
                                        <input id="shippingOption1" name="shipping-option" class="custom-control-input" checked="checked" type="radio">
                                        <label class="custom-control-label" for="shippingOption1">Pickup</label> <span class="float-right font-weight-bold">FREE</span> </div>
                                            <div class="ml-4 mb-2 small">All week</div></td>
                                <td>
                                    <div class="form-group col-md-6">
                                <label for="InputName" class="mb-0">First Name</label>
                                <input type="text" class="form-control" id="InputName" placeholder="First Name"> </div></td>
                                <td> <div class="mb-3">
                                <label for="address">Address *</label>
                                <input type="text" class="form-control" id="address" placeholder="" required>
                                <div class="invalid-feedback"> Please enter your shipping address. </div>
                            </div></td></tr>
                                    
                                        <tr>
                                            <td>
                                        <div class="custom-control custom-radio">
                                        <input id="shippingOption2" name="shipping-option" class="custom-control-input" type="radio">
                                        <label class="custom-control-label" for="shippingOption2">Express Delivery</label> <span class="float-right font-weight-bold">Free (Only To Rabat Area)</span> </div>
                                    <div class="ml-4 mb-2 small">Monday To sunday Exept Tuesday</div>
                                </td><td><div class="form-group col-md-6">
                                <label for="InputLastname" class="mb-0">Last Name</label>
                                <input type="text" class="form-control" id="InputLastname" placeholder="Last Name"> </div>
                                            
                                            </td><td>
                                            <div class="mb-3">
                                <label for="address2">Address 2 *</label>
                                <input type="text" class="form-control" id="address2" placeholder=""> </div></td></tr>
                                </tbody></table>
                                </div></div></div>
                                
                            
     <div class="cart-box-main">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="table-main table-responsive">
                        <table class="table">
                            <thead>
                                <tr>
                                    <th>Images</th>
                                    <th>Product Name</th>
                                    <th>Price</th>
                                                                    </tr>
                            </thead>
                            <tbody class ="cart-items">
                                <tr class = "removebut">
                              
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            

            <div class="row my-5">
                <div class="col-lg-8 col-sm-12"></div>
                <div class="col-lg-4 col-sm-12">
                    <div class="order-box">                                                                                                                                                                                                                                             
                        <div class="d-flex gr-total">
                            <h5>Grand Total</h5>
                            <div class="ml-auto h5"> <span id="total" class="d-flex-gr-total">$0.00</span></div>
                        </div>
                        <hr> </div>
                </div>
                <button onClick="sendMail" class= "sumbit type" type="submit">Sumbit</button>
            </div>

        </div>
    </div>

我认为问题出在头上，所以这里是 html 头代码，所以也许有人有更好的经验然后我可以帮助我，我真的很抱歉有太多问题，但这就是我学习的方式，也许有一天我也可以帮助人们： )

<html lang="en">
<!-- Basic -->

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <!-- Mobile Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Site Metas -->
    <title>Freshshop - Ecommerce Bootstrap 4 HTML Template</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Site Icons -->
    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <!-- Site CSS -->
    <link rel="stylesheet" href="css/style.css">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="css/responsive.css">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="css/custom.css">
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/emailjs-com@2/dist/email.min.js"></script>
<script type="text/javascript">
(function() {
emailjs.init("user_kYW9KXIGDrTbr7OrZS16g");
})();
</script>

Answer 1

您没有调用 sendMail() function。 另请注意，onclick 属性不是驼峰式。 下面的行应该适用于您的情况。

<button onclick="sendMail()" class= "sumbit type" type="submit">Sumbit</button>