jQuery单选按钮提交表单

Question

我在一页上有多种形式，都是这样的：ID值更改，但是选项可以相似。

<form class="test"><td>4000</td>
<td align='center'><input type='radio' name='radio' value='car' checked></td>
<td align='center'><input type='radio' name='radio' value='boat' ></td>
<td align='center'><input type='radio' name='radio' value='Plane' ></td>
<input type='hidden' name='id' value='4000'/>
<input type='hidden' name='location' value='local'/>
<div class="form" style="display: none;">
</div></form>

当选择三个单选按钮中的任何一个时，我试图使用JQuery提交它。

<script>
$("input[name='radio']").click(function() {
    var CurrectForm=$(this).parents('.test:first');
    $.post(
        'do.php',
        CurrectForm.serialize(),
        function( response ) {
            CurrectForm.find('#form').html( response );
               show( response );
        }
    );
} );
</script>

我使用了与上面类似的复选框和下拉列表，效果很好。 但这似乎没有将值提交到do.php页面。 提交的值以div形式显示。 做一个var_dump($_POST); 导致一个空数组。

有人可以指出我正确的方向吗？ 谢谢

更改表单ti似乎可行？

<td><form class="test">
<input type='radio' name='radio' value='car' checked>
<input type='radio' name='radio' value='boat' >
<input type='radio' name='radio' value='Plane' >
<input type='hidden' name='id' value='4000'/>
<input type='hidden' name='location' value='local'/>
<div class="form" style="display: none;">
</div></form></td>

为什么更改导致它起作用的原因？

Jfiddle的工作示例:) http://jsfiddle.net/QvpH5/

Answer 1

我的猜测是您的页面上有类test有多种形式。 发生的事情是，当您使用parents() ，您没有意识到它首先找到了所有祖先 ， 然后搜索了 .test:first 。 无论单击哪个表单，这将返回第一个表单的值。

查看此jsFiddle以查看修复（将.parents更改为.parent）： http : //jsfiddle.net/SDzzr/