验证表单后,我正在尝试将https://sodacitysolar.com/consultation.html上的表单重定向到https://sodacitysolar.com/thanks.html。我已经跟踪了代码,并相信解决方案位于下面的某个地方,即form.js文件:
$(function()
{
function after_form_submitted(data)
{
if(data.result == 'success')
{
$('form#reused_form').hide();
$('#success_message').show();
$('#error_message').hide();
}
else
{
$('#error_message').append('<ul></ul>');
jQuery.each(data.errors,function(key,val)
{
$('#error_message ul').append('<li>'+key+':'+val+'</li>');
});
$('#success_message').hide();
$('#error_message').show();
//reverse the response on the button
$('button[type="button"]', $form).each(function()
{
$btn = $(this);
label = $btn.prop('orig_label');
if(label)
{
$btn.prop('type','submit' );
$btn.text(label);
$btn.prop('orig_label','');
}
});
}//else
}
$('#reused_form').submit(function(e)
{
e.preventDefault();
$form = $(this);
//show some response on the button
$('button[type="submit"]', $form).each(function()
{
$btn = $(this);
$btn.prop('type','button' );
$btn.prop('orig_label',$btn.text());
$btn.text('Sending ...');
});
$.ajax({
type: "POST",
url: 'handler.php',
data: $form.serialize(),
success: after_form_submitted,
dataType: 'json'
});
});
});
我试图用下面的代码替换此代码,但是它不起作用:
$('form#reused_form').hide();
$('#success_message').show();
$('#error_message').hide();
function redirect()
{
window.location.href="thanks.html";
}
你们有机会向我指出正确的方向吗?
编辑:
这是我尝试使用的代码:
$(function()
{
function after_form_submitted(data)
{
if(data.result == 'success')
{
function redirect()
{
window.location.href="thanks.html";
}
}
else
{
$('#error_message').append('<ul></ul>');
jQuery.each(data.errors,function(key,val)
{
$('#error_message ul').append('<li>'+key+':'+val+'</li>');
});
$('#success_message').hide();
$('#error_message').show();
//reverse the response on the button
$('button[type="button"]', $form).each(function()
{
$btn = $(this);
label = $btn.prop('orig_label');
if(label)
{
$btn.prop('type','submit' );
$btn.text(label);
$btn.prop('orig_label','');
}
});
}//else
}
$('#reused_form').submit(function(e)
{
e.preventDefault();
$form = $(this);
//show some response on the button
$('button[type="submit"]', $form).each(function()
{
$btn = $(this);
$btn.prop('type','button' );
$btn.prop('orig_label',$btn.text());
$btn.text('Sending ...');
});
$.ajax({
type: "POST",
url: 'handler.php',
data: $form.serialize(),
success: after_form_submitted,
dataType: 'json'
});
});
});
答案 0 :(得分:0)
您创建了一个功能块,除非您实际调用该特定功能,否则该功能什么都不做。
例如:
function foo() {
console.log('bar');
}
这里,我有一个简单的功能,可以在控制台中打印bar
。但是,除非我首先调用它,否则上面的该函数将无济于事:
foo() // bar
在我的代码中调用它之后,我将在控制台中看到bar
。
您可以重新整理function knowledge here:
通常来说,函数是一个“子程序”,可以由函数外部(或在递归的情况下为内部)的代码调用。与程序本身一样,函数由称为函数主体的一系列语句组成。可以将值传递给函数,该函数将返回一个值。
但是要使您的代码正常工作,只需添加:
//...
redirect(); // calls the redirect function
// ...
这应该是这样的:
$(function () {
function after_form_submitted(data) {
if (data.result == 'success') {
$('form#reused_form').hide();
$('#success_message').show();
$('#error_message').hide();
// call the function
redirect();
} else {
$('#error_message').append('<ul></ul>');
jQuery.each(data.errors, function (key, val) {
$('#error_message ul').append('<li>' + key + ':' + val + '</li>');
});
$('#success_message').hide();
$('#error_message').show();
//reverse the response on the button
$('button[type="button"]', $form).each(function () {
$btn = $(this);
label = $btn.prop('orig_label');
if (label) {
$btn.prop('type', 'submit');
$btn.text(label);
$btn.prop('orig_label', '');
}
});
} //else
}
$('#reused_form').submit(function (e) {
e.preventDefault();
$form = $(this);
//show some response on the button
$('button[type="submit"]', $form).each(function () {
$btn = $(this);
$btn.prop('type', 'button');
$btn.prop('orig_label', $btn.text());
$btn.text('Sending ...');
});
$.ajax({
type: "POST",
url: 'handler.php',
data: $form.serialize(),
success: after_form_submitted,
dataType: 'json'
});
});
});
function redirect() {
window.location.href = 'thanks.html';
}