如何根据单选按钮（radio button）选中值动态修改AJAX POST请求URL

核心实现逻辑 #

你不需要使用if语句实现该需求，当前单选按钮已经将对应的请求地址作为value属性预设完成，直接读取选中项的value赋值给AJAX的url参数即可。

调整后的代码 #

JS代码修改 #

var barray = [];

function cbutton() {
  // 获取选中单选框的value值，即对应请求地址
  var targetUrl = $('input:radio[name="cheking"]:checked').val();
  var varies = $("#fromdate").val();
  var varies2 = $("#todate").val();
  
  if (varies == "" || varies2 == "") {
    alert("请先填写完两个日期字段后再提交");
  } else {
    barray.push(varies + "~" + varies2);
    $.ajax({
      type: "POST",
      url: targetUrl, // 替换为动态获取的请求地址
      data: {
        fromdate: varies,
        todate: varies2
      }
    }).done(function(msg) {
      // 可补充请求完成后的处理逻辑
    });
  }
}

可选HTML优化 #

你原有HTML的<label>标签for属性配置错误，for属性需要对应绑定的input元素id，修改后可实现点击label自动选中对应单选框，优化后代码如下：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" id="pickingi" name="cheking" class="checking" value="pickingeff.php" onchange="toggleVisibility('show1');" checked> &nbsp;
<label for="pickingi">Picking</label> &nbsp;

<input type="radio" id="packingi" name="cheking" class="checking" value="packingeff.php" onchange="toggleVisibility('show2');"> &nbsp;
<label for="packingi">Packing</label> &nbsp;

<input type="radio" id="overall" name="cheking" class="checking" value="overalleff.php" onchange="toggleVisibility('show3');"> &nbsp;
<label for="overall">Overall</label>

内容的提问来源于stack exchange，提问作者stoperan