HTML中的提交按钮不会调用Javascript

时间:2012-02-08 15:44:43

标签: php javascript html

出于某种原因,当我按下提交按钮时,我的javascript将无法执行。如果用户的名字和电子邮件地址是空的,它应该在两个文本字段旁边留下一条错误消息,但它不是,我无法弄清楚原因。通常,当两个框填满时,提交将转到发送电子邮件的php页面。任何有关修复我的JavaScript问题的建议或帮助将不胜感激。

这是我的javascript:

//my javascript function
<script type='text/javascript'>
function validate_form()
{
        $('span.error_message').html('');
        var success = true;
        $("#validate_form input").each(function()
        {
            if($(this).val()=="")
            {
                $(this).next().html("* You must complete this field"); // the error message
                success = false;
            }
        });
        return success;
    }
</script>

和我在html中的表单:

<form action=".....whatever....." method="POST" id="validate_form" onsubmit="return validate_form();">
    <ol>
        <li>
            <span id="question">___ is your name? My name is Marie.</span>
            <input type="text" name="q1" id="q1" />
        </li>
        <li>
            <span id="question">___ are you from? I'm from Paris, France.</span>
            <input type="text" name="q2" id="q2" />
        </li>
        <li>
            <span id="question">Dave: ___ you like football</span>
            <p>
                <input type="radio" name="q6" value="1" id="q6_1" />
                <label for="q6_1">Are</label>

                <input type="radio" name="q6" value="2" id="q6_2" />
                <label for="q6_2">Do</label>

                <input type="radio" name="q6" value="3" id="q6_3" />
                <label for="q6_3">Does</label>

                <input type="radio" name="q6" value="4" id="q6_4" />
                <label for="q6_4">Is</label>
            </p>
        </li>
    <div id="username">
        <p>
            Before we begin, please enter your name and email:
            <br />
            <label for="user_name">Name: </label><input type="text" name="user_name" id="user_name" />
                <span class="error_message" style="color:#FF0000"></span>
            <br />
            <label for="user_email">Email: </label><input type="text" name="user_email" id="user_email" />
                <span class="error_message" style="color:#FF0000"></span>
        </p>
    </div>

        <p style="width: 242px; margin: auto;">
            &nbsp;
            <input type="submit" name="submit" value="Submit your answers" id="but" />
        </p>
</form>

编辑:修复了调用javascript的问题,但现在即使填充了两个文本字段,提交按钮也无法正常工作。

2 个答案:

答案 0 :(得分:0)

$("#validate_form input") - 我在任何地方都看不到validate_form;您需要添加它或只使用:$("input")

答案 1 :(得分:0)

Firefox的Firebug可以帮助您调试这些类型的jscript问题。如果您不想安装firebug,也可以在Firefox中使用错误控制台。