无法使用 Javascript 验证表单； PHP重定向问题？答案

【问题标题】：Unable to validate a form using Javascript; PHP redirect issues?无法使用 Javascript 验证表单； PHP重定向问题？
【发布时间】：2011-02-27 17:58:48
【问题描述】：

我为朋友的爱好编写了一个简单的表格；基本上，我们试图猜测 2010 年 FIFA 世界杯的几支球队的首发阵容（只是为了踢球）。

无论如何，我需要验证以下表格。所有 Javascript 函数似乎都运行良好，因为如果我只是在标签的 outside 调用它们，一切正常。现在，我想执行一些基本的客户端验证（我知道，这不安全，但它是一种爱好，所以它不相关），然后将表单传递到另一个页面，其中有一个 PHP（当前使用 WAMP 服务器2.0) 脚本将收集数据并将其存储在数据库中。

这是表格：

<form name ="formPT" id="formPT" action="" onsubmit="return ValidaTudo();" method="post">
<a><img src="icons/paises/portugal-flag-icon.png" alt="portugal" border="0" style="vertical-align:middle"> Portugal</a>
<table id="tabela_PT" cellspacing="0" summary="Equipa">
<thead>
<tr>
<th scope="col" abbr="Nome" class="nobg">Nome</th>
<th scope="col" abbr="Posicao">Posição</th>
<th scope="col" abbr="Escolha">Escolha</th>
<th scope="col" abbr="Anterior">Escolha Anterior</th>
</tr>
</thead>
<tbody>
<tr><td scope="row" abbr="Jogador" class="spec">Eduardo</td><td>Guarda-redes</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Beto</td><td>Guarda-redes</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Daniel Fernandes</td><td>Guarda-redes</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Paulo Ferreira</td><td>Defesa</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Miguel</td><td>Defesa</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Ricardo Carvalho</td><td>Defesa</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Bruno Alves</td><td>Defesa</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Ricardo Costa</td><td>Defesa</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Fabio Coentrao</td><td>Defesa</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
<tr><td scope="row" abbr="Jogador" class="spec">Pepe</td><td>Médio</td><td><select  name="escolhaPT"><option value="EF">EF</option><option value="SP">SP</option><option value="NU" selected="selected">NU</option></select> </td><td>NU</td></tr>
</tbody>
</table>        
<input type='submit' value='Check Field' />
</form>

现在介绍一下 Javascript：

 function ValidaTudo()
{
    alert('debug: validating...')
    if(Valida('PT'))
    {
        alert('fine!');
        return true;
    }
    else
    {
        alert('useless validation message but wth');
        return false;
    }
}

显然还有更多的 javascript 函数，但是：

我没有从该 javascript 函数中收到任何警报弹出窗口！
页面很简单，重定向到 index.php 所以我假设这是一个 PHP/WAMP 问题...我重新启动了 WAMP 好几次，但到目前为止没有运气。虽然我认为我应该重启我的电脑，但我还没有重启。

我错过了什么？提前谢谢各位！

PS：是的，表单根本没有将数据发送到任何页面；我知道;它对奇怪的行为没有任何影响，我已经尝试过了。

编辑：这是其余的验证功能。它们用于检查用户是否遵循某些规则（例如：准确选择 11 名球员；1 名守门员；至少 3 名后卫，等等......）。我传递了几个参数，因为在完整的表格中，我们试图猜测 4 支球队（葡萄牙、西班牙、巴西和阿根廷）的球员 - 因此有 4 个表格，每个表格都有不同的 ID（基于国家的标识符 - > {PT、BR、AR、ES} 以下是其余的函数（请记住，它们在表单之外工作）：

function Valida (textstring) 
{
    var error_msg = null; 

    if(!valida_11(textstring.toUpperCase()))
    {
        error_msg = 'Erro para a equipa ' + textstring.toUpperCase() + ': deve selecionar apenas 11 jogadores efectivos';
        alert(error_msg);
    }

    if (!valida_gk(textstring.toUpperCase()))
    {
        error_msg = 'Erro para a equipa ' + textstring.toUpperCase() + ': deve selecionar um e um só 1 guarda-redes efectivo';
        alert(error_msg);
    }

    if (!valida_def(textstring.toUpperCase()))
    {
        error_msg = 'Erro para a equipa ' + textstring.toUpperCase() + ': deve selecionar um mínino de 3 defesas efectivo';
        alert(error_msg);
    }

    if(error_msg == null)
        return true;
    else return false;
}

function valida_11(tbl)
{
    var ef = 0;
    var input_list = document.getElementsByName('escolha' + tbl);

    for(var i = 0; i < input_list.length; i++) 
    {
        var a = input_list[i].value;
        if(a == "EF")
            ef++;
    }

    if (ef == 11)
        return true;
    else return false;
}

function valida_gk(tbl)
{   
    var ef = 0;
    var gks = conta_gks(tbl);
    var input_list = document.getElementsByName('escolha' + tbl);

    for(var i = 0; i < gks; i++) 
    {
        var a = input_list[i].value;
        if(a == "EF")
            ef++;
    }

    if (ef == 1)
        return true;
    else return false;
}

function valida_def(tbl)
{
    var defs = conta_defs(tbl);
    var gks = conta_gks(tbl);

    var ef = 0;
    var input_list = document.getElementsByName('escolha' + tbl);

    for(var i = gks-1; i < gks + defs; i++) 
    {
        var a = input_list[i].value;
        if(a == "EF")
            ef++;
    }

    if (ef >= 3)
        return true;
    else return false;
}

function conta_defs(tbl)
{
    var defs = 0;
    var tabela = document.getElementById('tabela_' + tbl);

    for(var i = 1; i < tabela.getElementsByTagName("tr").length; i++)
    {
        var linha = tabela.getElementsByTagName("tr")[i];
        var celula = linha.getElementsByTagName("td")[1];

        if(celula.innerHTML == "Defesa")
            defs++;
    }

    return defs;
}


function conta_gks(tbl)
{
    var gk = 0;
    var tabela = document.getElementById('tabela_' + tbl);

    for(var i = 1; i < tabela.getElementsByTagName("tr").length; i++)
    {
        var linha = tabela.getElementsByTagName("tr")[i];
        var celula = linha.getElementsByTagName("td")[1];

        if(celula.innerHTML == "Guarda-redes")
            gk++;
    }

    return gk;
}

编辑 2：在其他浏览器中也会发生同样的情况，例如 IE 7。编辑3：重新启动PC，但问题仍然存在......：/

好的，我设法将页面上线@：http://testing.freeoda.com/teste.html 试一试。在这里，我收到 404 错误；没有调用 JS 函数....

【问题讨论】：

在页面下方；我没有粘贴它，因为我什至没有从 ValidaTudo 函数中获得警报。另外，整个 Javascript 函数集在表单标记之外都可以正常工作。不过我可以贴，没问题。
if(Valida('PT')) 函数定义在哪里？
具有onsubmit 属性的<form> 是否正确显示在例如Firebug 或其他 DOM 检查器？你有示例页面吗？
是的，Firebug 完全没有显示任何内容。在开发网站的其余部分和这种形式的开发过程中，我大量使用了它，并在测试其余功能时也使用了它。
你的意思是“它没有显示错误”或“表单/属性没有显示”？

标签： php javascript html wamp

【解决方案1】：

即使没有 action=""，表单也会刷新页面。尝试改写onsubmit="return ValidaTudo();" 这个：action="javascript:ValidaTudo();" )))

【讨论】：

“;”在哪里alert('debug: validating...')之后你错过了吗？
很好的电话；是的，它在测试页面中丢失了。奇怪的是，没有输出错误！仍然，它不起作用:(
可以使用opera错误控制台和opera dragnfly定位js bug。
或者我可以打开 Firefox 的控制台并使用 Firebug 来定位错误...我做到了。仍然它不起作用。
如果 <form name ="formPT" id="formPT" action="javascript:ValidaTudo();" method="post"> 返回 false;)))

【解决方案2】：

嗯，这很尴尬... 我的错。我搞砸了，因为我正在使用另一个忘记关闭标签的程序员制作的糟糕菜单栏；一切都按预期进行，因为我们看到的实际形式实际上是在另一个内部。 /掌心

我向你们所有人道歉，感谢你们的时间和耐心。

【讨论】：

我讨厌你花时间处理 PHP、JavaScript、CSS 等，结果发现问题是 HTML 格式错误！
确实如此。今天我为此浪费了 6 个小时。