1

为了我的学习目的，我编写了一个简单的 javaScript 函数来使用 JS 验证所需的 userName 字段。

我面临两个问题-

  1. 在提交按钮中，onclick 事件处理程序不调用 checkRequired方法，并回发表单。
  2. 我无法在 chrome 调试器中设置断点。
  3. 即使在代码中专门使用调试器也不会将控件带到调试器断点。

任务管理器.js

function checkRequired() {
    debugger;
    var userName = document.getElementById("txtUserName");
    if (userName.length == 0) {
        alert("username is required attribute");
        return false;
    }
    return true;
}

添加新用户：

<html>
<head>
    <title>Add new User</title>
    <style type="text/css" media="all">
        button {
            width: 65px;
        }
    </style>
    <script src="TaskManager.js" type="text/javascript"></script>
</head>
<body>
    <form method="post" action="AddNewUser.html" style="width: 560px; height: 850px; margin-left: 10px; margin-top: 10px">
        <fieldset>
            <legend>New User</legend>
            <table>
                <tr>
                    <td>
                        <label>User Name:</label></td>
                    <td>
                        <input type="text" id="txtUserName" name="User Name" maxlength="10" /></td>
                </tr>

                <tr>
                    <td>
                        <button id="btnSubmit" type="submit" onclick="checkRequired()">Add User</button>
                    </td>
                    <td>
                        <button id="btnCancel">Cancel</button>
                    </td>
                </tr>

            </table>
        </fieldset>

    </form>

</body>
</html>

感谢您为解决问题提供的任何帮助。

4

2 回答 2

2

如果你的断点没有到达，那么这个函数就无法访问，你应该在控制台中得到一个错误。该函数是否在全局范围内？

这是您的代码，我对其进行了一些更改以使其正常工作。首先必须考虑处理程序的结果：

<button id="btnSubmit" type="submit" onclick="javaScript:return checkRequired();">

然后，您必须.value.length在您尝试验证的文本框中进行检查：

var userName = document.getElementById("txtUserName");
if (userName.value.length === 0) {[...]

无论如何，如果可能，我建议您使用不显眼的方法，并将事件直接绑定到您的 javascript 代码中，而不是在标记中定义它：

var submitBtn = document.getElementById("btnSubmit");
submitBtn.onclick = function checkRequired() {
    console.log('aho');
    var userName = document.getElementById("txtUserName");
[...]
于 2012-10-26T06:32:13.467 回答
0

检查是否正在加载脚本文件。在函数定义之外的文件顶部放置一个警报。

如果警报未显示，请仔细检查脚本文件的名称。它与脚本标签中引用的相同吗？它在同一个目录中吗？

于 2012-10-26T06:42:39.667 回答