javascript - 我有一个 SMSgateway JavaScript API，我想将其与我的网站集成，但不知怎的，它似乎不起作用

Question

    <form onsubmit="return process()" method="post">
    <table style="background-color:rgba(0,0,0,.1); border-radius:8px">
    <tr>
        <td>Name:</td>
        <td><input type="text" name="name" id="apname" placeholder="Name" required /></td></tr>
    <tr>
        <td>Age:</td>
        <td><input type="text" name="age" id="apage" placeholder="Age" required /></td></tr>
    <tr>
        <td>Phone:</td>
        <td><input type="text" name="phone" id="apphone" placeholder="For the OTP" onchange="return validation();" required /></td></tr>
    <tr>
        <td>Date:</td>
        <td><input type="date" name="date" id="apdate" required /></td></tr>
    <tr>            
        <td></td>
        <td><button class="btn btn-success" id="button" style="width:90px" type="submit">Proceed</button>
        <button class="btn btn-danger" style="width:90px" onclick="window.location.href='index.html'">Cancel</button></td></tr>
        <span id="err" style="color:#FF0000"></span>
    </table></form>
    </div>
</div>

<script>
function process(){
    var mcAuthkey = "42A1zr6NGQ6ip";
    var theName = document.getElementById('#apname').value;
    var age = document.getElementById('#apage').value;
    var phone = document.getElementById('#apphone').value;
    var date = document.getElementById('#apdate').value;
    var msg = "theNam+ aged +age+ has booked for an appointment on +date+. Contact: +phone";
    var settings = {
    "async": true,
    "crossDomain": true,
    "url": "http://api.msg91.com/api/v2/sendsms",
    "method": "POST",
    "headers": {
    "authkey": "mcAuthkey",
    "content-type": "application/json"
    },
    "processData": false,
    "data": "{ \"sender\": \"SOCKET\", \"route\": \"4\", \"country\": \"91\", \"sms\": [ { \"message\": \"msg\", \"to\": [ \"phone\" ] } ] }"
    }

    $.ajax(settings).done(function (response) {
    console.log(response);
    });
    event.preventDefault();
    return false;
}
</script>

</body>
</html>

我希望“流程功能”在提交表单时正常工作。知道可能出了什么问题吗？我也不能使用任何框架或其他服务器端语言。我只能使用 HTML + JavaScript。正在使用 apache cordova 构建 Android 应用程序。

Answer 1

首先，您没有定义在更改第三个字段时调用的验证函数。

由于您使用的是 native document.getElementById，因此您传入的元素 id 不带哈希值。

您不应引用 mcAuthkey，因为它是一个变量。

当然，您已经将 jquery 库添加到了 html 中。

此 REST api 需要传递正确的身份验证 key 。我将无法测试它。您必须使用有效的身份验证 key 。

编辑

API 中的示例 post 调用: http://api.msg91.com/api/v2/sendsms?authkey=YourAuthKey&mobiles=98260XXXXX,98261XXXXX&message=message&sender=senderid&route=4&country=0

他们的指令是here

我必须更新您的一些字段以匹配它们的结构。

下面是更新的代码片段

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form onsubmit="return process()" method="post">
    <table style="background-color:rgba(0,0,0,.1); border-radius:8px">
    <tr>
        <td>Name:</td>
        <td><input type="text" name="name" id="apname" placeholder="Name" required /></td></tr>
    <tr>
        <td>Country code:</td>
        <td><input type="text" name="country" id="country" placeholder="Country code" required /></td></tr>
    <tr>
        <td>Phone:</td>
        <td><input type="text" name="phone" id="apphone" placeholder="For the OTP" onchange="return validation();" required /></td></tr>
    <tr>
        <td>Date:</td>
        <td><input type="date" name="date" id="apdate" required /></td></tr>
    <tr>            
        <td></td>
        <td><button class="btn btn-success" id="button" style="width:90px" type="submit">Proceed</button>
        <button class="btn btn-danger" style="width:90px" onclick="window.location.href='index.html'">Cancel</button></td></tr>
        <span id="err" style="color:#FF0000"></span>
    </table></form>
    </div>
</div>

<script>
function validation(){
  return true;
}
function process(){
    var mcAuthkey = "42A1zr6NGQ6ip";
    var theName = document.getElementById('apname').value;
    var country = document.getElementById('country').value;
    var phone = document.getElementById('apphone').value;
    var date = document.getElementById('apdate').value;
    var msg = "theNam+ aged +age+ has booked for an appointment on +date+. Contact: +phone";
    var settings = {
    "async": true,
    "crossDomain": true,
    "url": "http://api.msg91.com/api/v2/sendsms",
    "method": "POST",
    "headers": {
    "authkey": mcAuthkey,
    "content-type": "application/json"
    },
    "processData": false,
    "data": { 
    	sender: "SOCKET", 
    	route: "4",
    	country: country, 
    	flash:1, 
    	sms: [ { "message: msg, to: phone} ] }
    }

    $.ajax(settings).done(function (response) {
    console.log(response);
    });
    event.preventDefault();
    return false;
}
</script>

</body>
</html>