jquery - 单选按钮值未传递给 jquery 中的 post 函数

Question

我试图从单选按钮中获取价值，比如性别是男性还是女性。我将它存储在值变量中，但是在将它传递给 $.post 时它不起作用？代码片段是 -

$(document).ready(function() {
  // Handler for .ready() called.

  $("input:radio[name=gender]").click(function() {
    var value = $(this).val();
    alert (value);
  });
  alert (value);
  $.post("gendersearch.php", {queryString: ""+value+""}, function(data) { // Do an AJAX call
    $('#suggestions').fadeIn(); // Show the suggestions box
    $('#suggestions').html(data); // Fill the suggestions box
  });

});

如何纠正？问题是什么。

Answer 1

$("input:radio[name=gender]").click(function() {
        var value = $(this).val();
        alert (value);
    });
      alert (value);

请检查变量的范围在value外部定义它并尝试这样

var value = '';
  $("input:radio[name=gender]").click(function() {
            value = $(this).val();
            alert (value);
  });
  alert (value);

Answer 2

将value变量放在click事件之外。

$(document).ready(function() {
    // Handler for .ready() called.
    var value = "";
    $("input:radio[name=gender]").click(function() {
        value = $(this).val();
        alert(value);
    });
    alert(value);
    $.post("gendersearch.php", {
        queryString: "" + value + ""
    }, function(data) { // Do an AJAX call
        $('#suggestions').fadeIn(); // Show the suggestions box
        $('#suggestions').html(data); // Fill the suggestions box
    });
});

Answer 3

正如建议的那样，您可以通过两种方式执行此操作 -

第一

在您的点击函数上方声明var value = '';，如下面的代码

$(document).ready(function() {
  // Handler for .ready() called.
   var value="";
  $("input:radio[name=gender]").click(function() {
   value = $(this).val();
    alert (value);
  });
  alert (value);
  $.post("gendersearch.php", {queryString: ""+value+""}, function(data) { // Do an AJAX call
    $('#suggestions').fadeIn(); // Show the suggestions box
    $('#suggestions').html(data); // Fill the suggestions box
  });

});

第二

另一种方法是在 click 函数中声明 post 方法

    $(document).ready(function() {
      // Handler for .ready() called.

      $("input:radio[name=gender]").click(function() {
        var value = $(this).val();
        alert (value);
 $.post("gendersearch.php", {queryString: ""+value+""}, function(data) { // Do an AJAX call
        $('#suggestions').fadeIn(); // Show the suggestions box
        $('#suggestions').html(data); // Fill the suggestions box
      });
      });
      //alert (value);
    });

好吧，我认为它是双向的。但是第一个更容易！和更好。