Ajax 函数虽然在脚本中定义,但无法识别
Ajax function is not recognized although it is defined in the script
我正在尝试使用一个按钮提交两个单独的表单。经过几天的研究,我得出的结论是,如果不使用 AJAX.
就无法做到这一点
第一种形式提交给 Mikrotik 路由器(这样用户就可以访问 HotSpot),它会检查用户名和密码。 Mikrotik 登录页面需要这个 "path":$(link-login-only).
第二个表单必须发送用户输入的电子邮件,但它必须在 cca 之后发送。 0.5 秒,因为用户访问互联网大约需要那么长时间。
到目前为止,我遇到了两个无法解决的错误:
第 1:在这一行:<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
- Uncought ReferenceError: SendAjax is not defined
2cnd:在这一行上 url: "$(link-login-only)",
- Uncought SyntaxError: Unexpected Identifier
完整代码:
!DOCTYPE html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous">
</script>
<title>Post with delay</title>
</head>
<body>
<form name="hotspot" action="$(link-login-only)" method="post" id="hotspot"
$(if chap-id) onSubmit="return doLogin(); return false;" $(endif)>
<input type="hidden" name="dst" value="$(link-orig)" />
<input type="hidden" name="popup" value="true" />
<input type="hidden" name="username" type="text" value="username" />
<input type="hidden" name="password" type="password" value="password" />
</form>
<form name="mail" action="http://myserveraddress/verifysanitize.php" method="post" id="mail">
<h1>Hotspot</h1>
<h2>To gain internet access, enter your email.</h2>
<br />
<input type="text" name="email" autofocus="autofocus">
<br />
<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
</form>
</body>
<script rel="javascript" type="text/javascript">
function SendAjax() {
var email = $("#email").val();
// Check if fields are empty
if (email=="") {
alert("Please enter your email.");
}
// AJAX code to submit form
else {$.ajax({
type: "POST"
url: "$(link-login-only)",
data: $("#hotspot").serialize(),
});
function callback(){
$.ajax ({
url: $("#mail").attr('action'),
}
});
}
setTimeout(callback(), 1000);
}
}
</script>
</html>
在发布前查看代码后,在第一个表单上添加一个隐藏按钮,并使用 ajax 在延迟 0.5 秒之前发送第一个表单然后执行第二种形式?
请试试这个:
!DOCTYPE html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous">
</script>
<title>Post with delay</title>
</head>
<body>
<form name="hotspot" action="$(link-login-only)" method="post" id="hotspot"
$(if chap-id) onSubmit="return doLogin(); return false;" $(endif)>
<input type="hidden" id="dst" name="dst" value="$(link-orig)" />
<input type="hidden" id="popup" name="popup" value="true" />
<input type="hidden" id="username" name="username" type="text" value="username" />
<input type="hidden" id="password" name="password" type="password" value="password" />
</form>
<form name="mail" action="http://myserveraddress/verifysanitize.php" method="post" id="mail">
<h1>Hotspot</h1>
<h2>To gain internet access, enter your email.</h2>
<br />
<input type="text" id="email" name="email" autofocus="autofocus">
<br />
<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
</form>
</body>
<script rel="javascript" type="text/javascript">
$(document).on('click', '#submit', function(event) {
if (!$("#email").val()) {
alert("Please enter your email.");
return false;
}
// AJAX code to submit form #hotspot
$.ajax({
type: "POST"
url: "$(link-login-only)",
data: $("#hotspot").serialize(),
success: (data => {
console.log(data)
// After getting response of #hotspot, Subbmitting the second form #mail
$.ajax ({
url: $("#mail").attr('action'),
data: $("#mail").serialize(),
success: (dataMail => {
console.log(dataMail);
}),
error: (errorMail => {
console.log(`#hotspot successfuly submitted but #mail getting error: ${errorMail}`)
})
})
}),
error: (error => {
console.log(`#hotspot not submitted because #mail getting error: ${error}`);
})
});
});
</script>
</html>
我觉得你的代码没问题你有语法错误检查下面这个
对于第一个错误,您需要在按钮事件上调用该函数。
$(document).on('click', '#submit', function(event) {
event.preventDefault();
var email = $("#email").val();
// Check if fields are empty
if (email=="") {
alert("Please enter your email.");
}else {
$.ajax({
type: "POST"
url: "$(link-login-only)",
data: $("#hotspot").serialize(),
})
.always(function() {
console.log("first call completed");
});
function callback(){
$.ajax ({
url: $("#mail").attr('action'),
// } you need to remove this parenthesis
});
}
setTimeout(callback(), 1000);
}
});
第二个错误是因为你多了一个右括号}
未定义 SendAjax 的原因是您的脚本可能与您的代码不在同一个文件中。 SendAjax 的工作原理如下:
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous">
</script>
<title>Post with delay</title>
</head>
<body>
<form name="hotspot" action="$(link-login-only)" method="post" id="hotspot"
$(if chap-id) onSubmit="return doLogin(); return false;" $(endif)>
<input type="hidden" name="dst" value="$(link-orig)" />
<input type="hidden" name="popup" value="true" />
<input type="hidden" name="username" type="text" value="username" />
<input type="hidden" name="password" type="password" value="password" />
</form>
<form name="mail" action="http://myserveraddress/verifysanitize.php" method="post" id="mail">
<h1>Hotspot</h1>
<h2>To gain internet access, enter your email.</h2>
<br />
<input type="text" name="email" autofocus="autofocus">
<br />
<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
</form>
</body>
<script rel="javascript" type="text/javascript">
function SendAjax() {
alert('OK');
}
</script>
</html>
我正在尝试使用一个按钮提交两个单独的表单。经过几天的研究,我得出的结论是,如果不使用 AJAX.
就无法做到这一点第一种形式提交给 Mikrotik 路由器(这样用户就可以访问 HotSpot),它会检查用户名和密码。 Mikrotik 登录页面需要这个 "path":$(link-login-only).
第二个表单必须发送用户输入的电子邮件,但它必须在 cca 之后发送。 0.5 秒,因为用户访问互联网大约需要那么长时间。
到目前为止,我遇到了两个无法解决的错误:
第 1:在这一行:<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
- Uncought ReferenceError: SendAjax is not defined
2cnd:在这一行上 url: "$(link-login-only)",
- Uncought SyntaxError: Unexpected Identifier
完整代码:
!DOCTYPE html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous">
</script>
<title>Post with delay</title>
</head>
<body>
<form name="hotspot" action="$(link-login-only)" method="post" id="hotspot"
$(if chap-id) onSubmit="return doLogin(); return false;" $(endif)>
<input type="hidden" name="dst" value="$(link-orig)" />
<input type="hidden" name="popup" value="true" />
<input type="hidden" name="username" type="text" value="username" />
<input type="hidden" name="password" type="password" value="password" />
</form>
<form name="mail" action="http://myserveraddress/verifysanitize.php" method="post" id="mail">
<h1>Hotspot</h1>
<h2>To gain internet access, enter your email.</h2>
<br />
<input type="text" name="email" autofocus="autofocus">
<br />
<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
</form>
</body>
<script rel="javascript" type="text/javascript">
function SendAjax() {
var email = $("#email").val();
// Check if fields are empty
if (email=="") {
alert("Please enter your email.");
}
// AJAX code to submit form
else {$.ajax({
type: "POST"
url: "$(link-login-only)",
data: $("#hotspot").serialize(),
});
function callback(){
$.ajax ({
url: $("#mail").attr('action'),
}
});
}
setTimeout(callback(), 1000);
}
}
</script>
</html>
在发布前查看代码后,在第一个表单上添加一个隐藏按钮,并使用 ajax 在延迟 0.5 秒之前发送第一个表单然后执行第二种形式?
请试试这个:
!DOCTYPE html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous">
</script>
<title>Post with delay</title>
</head>
<body>
<form name="hotspot" action="$(link-login-only)" method="post" id="hotspot"
$(if chap-id) onSubmit="return doLogin(); return false;" $(endif)>
<input type="hidden" id="dst" name="dst" value="$(link-orig)" />
<input type="hidden" id="popup" name="popup" value="true" />
<input type="hidden" id="username" name="username" type="text" value="username" />
<input type="hidden" id="password" name="password" type="password" value="password" />
</form>
<form name="mail" action="http://myserveraddress/verifysanitize.php" method="post" id="mail">
<h1>Hotspot</h1>
<h2>To gain internet access, enter your email.</h2>
<br />
<input type="text" id="email" name="email" autofocus="autofocus">
<br />
<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
</form>
</body>
<script rel="javascript" type="text/javascript">
$(document).on('click', '#submit', function(event) {
if (!$("#email").val()) {
alert("Please enter your email.");
return false;
}
// AJAX code to submit form #hotspot
$.ajax({
type: "POST"
url: "$(link-login-only)",
data: $("#hotspot").serialize(),
success: (data => {
console.log(data)
// After getting response of #hotspot, Subbmitting the second form #mail
$.ajax ({
url: $("#mail").attr('action'),
data: $("#mail").serialize(),
success: (dataMail => {
console.log(dataMail);
}),
error: (errorMail => {
console.log(`#hotspot successfuly submitted but #mail getting error: ${errorMail}`)
})
})
}),
error: (error => {
console.log(`#hotspot not submitted because #mail getting error: ${error}`);
})
});
});
</script>
</html>
我觉得你的代码没问题你有语法错误检查下面这个 对于第一个错误,您需要在按钮事件上调用该函数。
$(document).on('click', '#submit', function(event) {
event.preventDefault();
var email = $("#email").val();
// Check if fields are empty
if (email=="") {
alert("Please enter your email.");
}else {
$.ajax({
type: "POST"
url: "$(link-login-only)",
data: $("#hotspot").serialize(),
})
.always(function() {
console.log("first call completed");
});
function callback(){
$.ajax ({
url: $("#mail").attr('action'),
// } you need to remove this parenthesis
});
}
setTimeout(callback(), 1000);
}
});
第二个错误是因为你多了一个右括号}
未定义 SendAjax 的原因是您的脚本可能与您的代码不在同一个文件中。 SendAjax 的工作原理如下:
<html>
<head>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous">
</script>
<title>Post with delay</title>
</head>
<body>
<form name="hotspot" action="$(link-login-only)" method="post" id="hotspot"
$(if chap-id) onSubmit="return doLogin(); return false;" $(endif)>
<input type="hidden" name="dst" value="$(link-orig)" />
<input type="hidden" name="popup" value="true" />
<input type="hidden" name="username" type="text" value="username" />
<input type="hidden" name="password" type="password" value="password" />
</form>
<form name="mail" action="http://myserveraddress/verifysanitize.php" method="post" id="mail">
<h1>Hotspot</h1>
<h2>To gain internet access, enter your email.</h2>
<br />
<input type="text" name="email" autofocus="autofocus">
<br />
<input type="button" value="Submit" id="submit" onclick="SendAjax()"> <br />
</form>
</body>
<script rel="javascript" type="text/javascript">
function SendAjax() {
alert('OK');
}
</script>
</html>