Question

以下代码的目标是切换一组名为“knowsnumberofpeople”的单选按钮。不幸的是，在显示第一个消息框并且单选按钮正确更改后，jQuery会返回并将所有内容切换到原始状态。

为什么jQuery会回到集合中的前一个项目？

代码：

 <script type="text/javascript">
        $("input[name='numberofpeople']").change(function() {
            $("input[name='knowsnumberofpeople']").each(function() {
            alert("Hi there.");                
                if ($(this).attr("checked") === "Checked") {
                    $(this).attr("checked", "");
                }
                else {
                    $(this).attr("checked", "Checked");
                }
            }
            );
        }
        );
    </script>

修改

回答问题和评论......

不，这两件事情是不同的。一个单选按钮有一个文本框，另一个没有。两个单选按钮都具有相同的名称。单选按钮名为knowsnumberofpoeple，文本框名为numberofpeople。他们的单选按钮具有相同的ID，这要归功于ASP .NET MVC（我尝试通过htmlAttribute设置他们的id，但没有成功）。

他们走向原来的状态。

没有任何事件与知识人控制有关。

为什么不读取值并设置它？

我尝试过它不起作用：

$("input[name='knowsnumberofpeople']").val = true;

karbassi的解决方案也不起作用。它只是切换第二个单选按钮（没有文本框的那个）。

更多代码

<form action="/ReserveSpace/ExpectedAttendance" method="post">
    <fieldset class="smallform">
        <input id="knowsnumberofpeople" name="knowsnumberofpeople" type="radio" value="True" />
        <input id="numberofpeople" name="numberofpeople" type="text" value="" />

        <label for="numberofpeople">
            (e.g. 20)</label><br />
        <input checked="checked" id="knowsnumberofpeople" name="knowsnumberofpeople" type="radio" value="False" />
        <label>
            I'm not sure.
        </label>
        <p>
            <input type="submit" value="Next" accesskey="N" /></p>
    </fieldset>
    </form>

Answer 1

如果您要检查是否选中了复选框/单选按钮，请使用

$(this).is(":checked")

其次，您的代码有一个主要的逻辑错误。在任何给定时间只能检查一个单选按钮，但是您的代码会通过并“检查”每个尚未检查的单选按钮。

因此，无论你做什么，都应该检查最后一个选项，除非它已经被检查过，在这种情况下，不会检查任何选项。

你不应该只是从numberofpeople读取一个值，然后选择合适的单选按钮吗？

Answer 2

试试这个：

<script type="text/javascript">
   $("input[name='numberofpeople']").change(function() {
      $("input[name='knowsnumberofpeople']").each(function() {
         if ($(this + ":checked").length > 0) {
            $(this).attr("checked", "");
         } else {
            $(this).attr("checked", "Checked");
         }
      });
   });
</script>

基本上，您在jQuery中使用$('input:checked')选择器。

第二个想法，使用这个

<script type="text/javascript">
   var tog = false; // or true if they are checked on load 

   $("input[name='numberofpeople']").change(function() {
      $("input[name=knowsnumberofpeople]").attr("checked", !tog);
      tog = !tog; 
   });
</script>

Answer 3

解决方案，感谢http://www.electrictoolbox.com/jquery-get-set-form-values/

        $("input[name='numberofpeople']").change(updateRadioButtons);

    function updateRadioButtons() {
        if ($("input[name='numberofpeople']").val() == "") {
            $("input[name=knowsnumberofpeople]")[1].checked = true;
        }
        else {
            $("input[name=knowsnumberofpeople]")[0].checked = true;
        }
    }

感谢大家的帮助，我已经投了特别有帮助的答案。

为什么jQuery的.each函数重演？

3 个答案:

第二个想法，使用这个