基于点击按钮用jQuery向其他页面传数据时数据异常求助

先帮你拆解下问题里的几个关键点，一步步来解决：

1. alert显示异常的核心原因：参数名冲突 #

你在$.ajax的success回调里用了data作为参数名，这和你之前定义的要POST的data变量重名了！

// 你定义的要提交的岗位数据
var data = { vacancyID: ... };
// 这里的data是服务器返回的响应内容，直接覆盖了上面的变量
success: function(data){ alert(data); }

所以你alert的是服务器返回的内容，不是你提交的岗位数据。如果想alert自己提交的数据，把回调参数改成别的名字就行，比如response：

success: function(response){ 
  console.log("提交的岗位ID:", data.vacancyID); // 这里的data就是你定义的单条岗位数据
  alert("服务器返回内容:" + response); 
}

2. vacancy.php无法获取POST数据的可能修复点 #

（1）检查数据格式与请求头 #

默认情况下jQuery会自动处理对象格式的data，但有时候全局设置或隐性问题会导致传递异常。你可以手动指定请求头并序列化数据：

$.ajax({
  type: 'POST',
  url: 'vacancy.php',
  contentType: 'application/x-www-form-urlencoded', // 明确指定表单格式
  data: $.param(data), // 手动把对象序列化为键值对字符串
  success: function(response){
    alert(response);
  },
  error: function(xhr, status, err){
    console.error("请求出错:", err); // 方便排查失败原因
  }
});

同时在vacancy.php里先写个简单的测试代码，确认是否能接收：

<?php
// 先打印收到的参数，测试用
echo "收到的岗位ID: " . ($_POST['vacancyID'] ?? '未获取到');
?>

（2）清理单元格文本的多余空白 #

你用.text()获取的单元格内容可能包含换行、空格，导致数据传递异常。给每个字段加个.trim()去掉前后空白：

var data = {
  vacancyID: obj.find('td.vacancyID').text().trim(),
  closeDate: obj.find('td.closeDate').text().trim(),
  roleLongTitle: obj.find('td.roleLongTitle').text().trim(),
  // 其他字段同理加上.trim()
}

3. 关于"是否传递多个岗位数据"的确认 #

你的代码里$(this).closest('tr')已经正确定位到了点击按钮所在的行，只会收集当前行的岗位数据，不会传递两个岗位的数据。控制台能正确打印data.vacancyID也证明了这部分逻辑是对的，不用担心多传的问题。

额外优化建议 #

为了避免动态添加按钮后事件失效，建议用事件委托绑定点击事件：

// 替换原来的$('.toggleButton').click(...)
$(document).on('click', '.toggleButton', function(){
  // 原来的逻辑不变
});

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