Question

我有一个文本字段，其中更改事件绑定到一个函数，该函数验证文本字段的值，并可能将相应的验证错误消息拼接到文本字段上方的DOM中。如果通过单击一对稍微不相关的单选按钮触发更改事件，单击的单选按钮将获得焦点，但是，根据我和用户的期望，不会检查 - 这就是问题。

虽然最终系统中的验证将使用AJAX在服务器端执行，但以下代码表明AJAX与此问题无关。

非常感谢你能告诉我我在这里缺少的东西：

<html>
<head>                                                                  
<STYLE type="text/css">
    .highlighted { color: red; }
</STYLE>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>          
</head>                                                                 
<body>                                                                  

<span id="errors">
</span>

<label for="mytextfield">First, type something in this textfield</>
<input type="text" id="mytextfield" name="mytextfield"/>

<p>Second, click on one of these radio buttons</>

<INPUT TYPE="radio" NAME="binaryquestion" VALUE="Y" >Yes</>
<INPUT TYPE="radio" NAME="binaryquestion" VALUE="N" >No</>

<script type="text/javascript">
    $(document).ready(function() {
        //$("#mytextfield").change(validateTextField);
        $("#mytextfield").change(spliceInTheValidationResultMessage);
    });

    function validateTextField() {
            $.ajax({
                url: 'http://www.google.com',
                success: function(data) {
                    spliceInTheValidationResultMessage();
                }
            });
    }

    function spliceInTheValidationResultMessage() {
        $("#errors").append("<p>Thank you for your input!</p>").addClass("highlighted");
        alert("I expect the radio button that you clicked to become checked. However, close this dialog and you'll see that it will have gained the focus but is NOT checked!");
    };

</script>
</body> 
</html>

Answer 1

对不起，我在你想要做的事情上遇到了一些麻烦，但你是不是想做这样的事情？

<input id="radio1" type="radio" name="binaryquestion" value="Y">Yes</>
<input id="radio2" type="radio" name="binaryquestion" value="N">No</>
<script type="text/javascript">$(document).ready(function () {
    //$("#mytextfield").change(validateTextField);
    //$("#mytextfield").change(spliceInTheValidationResultMessage);
    $("#radio1").bind("click", spliceInTheValidationResultMessage, false);
    $("#radio2").bind("click", spliceInTheValidationResultMessage, false);
});

我只是简单地将id属性添加到单选按钮输入中，并对它们使用jQuery bind（）方法。您可能希望更改validateTextField（）函数，以便它抓取文本字段中的文本。

单击类似AJAX的场景后，单选按钮未选中

1 个答案: