1

单击按钮时，我尝试获取下一个隐藏输入字段的值，但我的脚本始终返回“未定义”。我在做什么错，为什么 val() 返回未定义？如果仅尝试使用 next('input:hidden') 选择元素，则该函数将返回一个对象。

        <div class="row-fluid">
            <div class="span12">
                <div class="message-ratebox">
                    <ul class="unstyled inline">
                        <li>
                            <button class="rating-button" id="rating-first" value="1">
                                Er will dich
                            </button>1
                        </li>
                        <li>
                            <button class="rating-button" id="rating-second" value="2">
                                Er will dich nicht
                            </button>5
                        </li>
                        <li>
                            <button class="rating-button" id="rating-third" value="3">
                                Es ist alles offen
                            </button>2
                        </li>
                    </ul>
                    <input type="hidden" name="target_message_id" value="1" />
                </div>
            </div>
        </div>
        <div class="row-fluid">
            <div class="span12">
                <div class="message-ratebox">
                    <ul class="unstyled inline">
                        <li>
                            <button class="rating-button" id="rating-first" value="1">
                                Er will dich
                            </button>1
                        </li>
                        <li>
                            <button class="rating-button" id="rating-second" value="2">
                                Er will dich nicht
                            </button>5
                        </li>
                        <li>
                            <button class="rating-button" id="rating-third" value="3">
                                Es ist alles offen
                            </button>2
                        </li>
                    </ul>
                    <input type="hidden" name="target_message_id" value="2" />
                </div>
            </div>
        </div>

JavaScript：

$(document).ready(function() {
    $('button.rating-button').click(function(event) {
        event.preventDefault();
        var $rating = $(this).attr('value');
        var $messageId = $(this).next('input:hidden').val();

        alert('test'+$messageId);
    });
});
4

3 回答 3

4

这是因为没有next元素 for <button>。您必须向上爬 DOM 树，直到<div>找到隐藏元素：

var $messageId = $(this).closest(".message-ratebox").find("input:hidden").val();

或向上直到<ul>并选择next元素：

var $messageId = $(this).closest("ul").next("input:hidden").val();
于 2013-01-18T12:00:41.453 回答
0 
        $('button.rating-button').click(function(event) {
            event.preventDefault();
            var $rating = $(this).val();
            var $messageId = $(this).parent().parent().parent().find('input').val();
            alert($rating + $messageId );

           });
于 2013-01-18T12:12:06.813 回答
0

您需要从按钮向上解析到输入的容器，在这种情况下是最近的 div，然后向下解析到​​隐藏的输入...

$('button.rating-button').click(function(event) {
    event.preventDefault();
    var $rating = $(this).val();
    var $messageId = $(this).closest("div").find('input[type=hidden]').val();
    alert($rating + $messageId);
});
于 2013-01-18T12:17:22.083 回答