php - 使用 jQuery 确定根据其顺序发送的按钮

Question

问题：

根据订单确定发送了哪个单选按钮，并使用 PHP 提交值。

HTML表1代码：

<table class="table table-bordered neutralize" id="itembuttons">
    <thead>
        <tr>
            <th><input type="radio" name="3" id="3" value="6"></th>
            <th><input type="radio" name="3" id="3" value="7"></th>
            <th><input type="radio" name="3" id="3" value="8"></th>
            <th><input type="radio" name="3" id="3" value="9"></th>
            <th><input type="radio" name="3" id="3" value="10"></th>
        </tr>
    </thead>
</table>

HTML表2代码：

<table class="table table-bordered neutralize" id="itembuttons">
    <thead>
        <tr>
            <th><input type="radio" name="3" id="3" value="11"></th>
            <th><input type="radio" name="3" id="3" value="12"></th>
            <th><input type="radio" name="3" id="3" value="13"></th>
        </tr>
    </thead>
</table>

设想：

上面的代码将在 PHP 中生成一个名为“3”的 POST 变量，它的值在表 1 中的 6 到 10 或表 2 中的 11 和 13 之间。但是，我希望 jQuery 确定实际选择了哪个按钮。因此，例如，如果我选择第三个按钮（值 = 8 或值 = 13）），那么值 3 应该在隐藏的输入字段中发送。如果选择了第 5 个按钮（值 = 10），则应在隐藏的输入字段中发送值 5。

Answer 1

试试这个 - http://jsfiddle.net/Xa42c/

$("input[type=radio]").on("click", function(e) {
    $("input[type=hidden]").val( $(this).val() );

    alert( "Hidden field value is set to " + $(this).val() );
});​

请注意，您不需要id-s。但是如果你想使用它们，它们必须是唯一的

更新获取位置使用index()- http://jsfiddle.net/Xa42c/2/

$("input[type=radio]").on("click", function(e) {
    var index = $("input[type=radio]").index(this) + 1;
    $("input[type=hidden]").val( index );

    alert( "Hidden field value is set to " + index );
});​

Answer 2

您的代码的问题是 id 不是唯一的。尝试改变它们。如果您需要一些通用名称，您可以使用表的名称属性。

Answer 3

最终解决方案：

$(document).ready(function() {
    $('input[type=radio]', $('#itembuttons')).click(
        function() {
            var pos = $(this).parent().index() + 1;
            $('#hdnQuestion').val(pos);
            alert( 'The ' + $('#hdnQuestion').attr('name') + ' value is now ' + $('#hdnQuestion').val() );
        }
    );
});