Question

我有一个jquery脚本，它接受所选单选按钮的值并将其发布到另一个要处理的php脚本。我怀疑选择器有问题，但我用了

$("input[name='act']:checked").val()

在firebug控制台中

，它返回了正确的值。

此外，我使用警报显示所选值的弹出窗口，并使用以下命令返回正确的值：

alert($("input[name='act']:checked").val());

代码似乎也很可靠，因为我创建了一个“测试”字段来发布，并显示正确的值。

感谢您的帮助！

jquery代码：

<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>

<script type="text/javascript" language="javascript">
  $(document).ready(function() {
      $("#driver").click(function(event){
        alert($("input[name='act']:checked").val());

                 $('#mainarea').hide('fast');
                 $('#mainarea').empty();

          $.post(
           "facultyoptions.php",
           {
                act: $("input[name='act']:checked").val(),
                test: 'test'
           },
            function(data) {
                $('#mainarea').empty();
                $('#mainarea').append(data);
                $('#mainarea').show('slow');
             }

          );
      });
   });



   </script>

HTML

<form id="facultyportal" name="facultyportal" method="post" action="facultyoptions.php">

<input type="radio" id="blank" name="act" value="blank"/>
</br>
<input type="radio" id="copy" name="act" value="copy" />
</br>
<input type="radio" id="temp" name="act" value="temp"/>
</br>

<input type="button" id="driver" class="btn btn-danger" value="Submit" />

</form>

facultyoptions.php

<?php

echo 'HI</br>';

echo $_POST['act'];

echo $_POST['test'];

?>

结果：

您好
测试

Answer 1

您需要在return false处理程序的末尾click，或在处理程序的开头使用event.preventDefault()。

否则，您正在进行正常提交，刷新页面。

所以

  $(document).ready(function() {
      $("#driver").click(function(event){
            //alert($("input[name='act']:checked").val());

            $('#mainarea').hide('fast');
            $('#mainarea').empty();

            $.post("facultyoptions.php",{
                  act: $("input[name='act']:checked").val(),
                  test: 'test'
                },function(data) {
                   $('#mainarea').empty();
                   $('#mainarea').append(data);
                   $('#mainarea').show('slow');
                });

            return false;
      });
   });

哦，并删除警报，因为这可能会影响您停止正常提交的尝试。

更新以获取完整性

在评论中进行讨论后，我们将问题确定为.empty()来电。

相关input元素位于#mainarea元素内部，因此在访问之前它已被删除..

Answer 2

您无需提交表单

所以附加到提交事件并使用preventDefault - 无需在空

之后追加

$(function() {
  $("#facultyportal").on("submit",function(event){
    event.preventDefault(); // stop submission
    var act = $("input[name='act']:checked").val();// save before emptying
    $('#mainarea').empty().hide('fast');
    $.post("facultyoptions.php",{act: act,test: 'test'},
      function(data) {
        $('#mainarea').html(data).show('slow');
    });
  });
});

JQuery选择器工作，但不通过$ post

2 个答案: