Question

我有许多单选按钮，我希望用户可以选择标签，然后使用箭头键进行选择。

一旦他们选择了单选按钮，我希望他们选择标签到下一组，前一组将隐藏。

$("input").blur(function(){ $(this).closest('div').slideUp(); });

因此，如果单击第一部分中的单选按钮，则单击第二部分中的单选按钮，第一部分隐藏。这很棒。

我遇到的问题是，任何人使用箭头键选择同一部分中的下一个输入时，都会隐藏整个部分。

Updated JSfiddle

如何创建一个模糊功能，只有在您离开一组单选按钮时才会触发，而不是任何单个输入？

Answer 1

你需要检查tab键是否按下试试这个

        <div>
            <h4>Question 1</h4>
            <p><label for=""><input type="radio" name="question-1" value="1" />Answer 1</label></p>
            <p><label for=""><input type="radio" name="question-1" value="2" />Answer 2</label></p>
            <p><label for=""><input type="radio" name="question-1" value="3" />Answer 3</label></p>
            <p><label for=""><input type="radio" name="question-1" value="4" />Answer 4</label></p>
            <p><label for=""><input type="radio" name="question-1" value="5" />Answer 5</label></p>
            <p><label for=""><input type="radio" name="question-1" value="6" />Answer 6</label></p>
        </div>
        <div>
            <h4>Question 1</h4>
            <p><label for=""><input type="radio" name="question-2" value="1" />Answer 1</label></p>
            <p><label for=""><input type="radio" name="question-2" value="2" />Answer 2</label></p>
            <p><label for=""><input type="radio" name="question-2" value="3" />Answer 3</label></p>
            <p><label for=""><input type="radio" name="question-2" value="4" />Answer 4</label></p>
            <p><label for=""><input type="radio" name="question-2" value="5" />Answer 5</label></p>
            <p><label for=""><input type="radio" name="question-2" value="6" />Answer 6</label></p>
        </div>
        <script>
            $(document).keydown(function (event) {
                switch (event.keyCode) {
                    case 9:
                        $("input[type='radio']").blur(function () {
                            $(this).closest('div').slideUp();
                        });
                        break;
                }
            });

            $("input[type='radio']").blur(function () {
                $('body').append('Focus lost');
            });
        </script>

希望这会对你有所帮助。

jQuery模糊输入同名，而不是单独的单选按钮

1 个答案: