基于数据库休假类型在Blade循环中打开对应文件的技术问询

看起来你想要遍历休假政策数据，让用户点击PDF图标时，根据数据库里的休假类型打开对应的文件对吧？我来给你调整下代码，两种实用方案供你选择：

首先先贴出你的原始代码片段方便对照：

<tbody id="myTable">
  <tr class="tr">
    <td class="text-center">{{ $leaves->id }}</td>
    <td id="policy"><span class="leave"> {{ $leaves->leave_policy }}</span> </td>
    <td>
      <a href="#" onclick="check()" class="attachment-icon-pdf mr-5">
        <i class="fa fa-file-pdf-o" aria-hidden="true"></i>
      </a>
      <!-- 剩余代码省略 -->
    </td>
  </tr>
</tbody>

方案一：直接用Blade模板生成动态链接（推荐） #

这种方式不需要额外JS，直接利用Blade的条件判断生成对应文件的链接，更符合HTML语义，也更稳定：

<tbody id="myTable">
  @foreach($leaves as $leave) <!-- 注意循环时单个元素用$leave，集合用$leaves -->
  <tr class="tr">
    <td class="text-center">{{ $leave->id }}</td>
    <td class="policy"><span class="leave"> {{ $leave->leave_policy }}</span> </td>
    <td>
      <a href="{{ 
        $leave->leave_policy == '年假' ? '/documents/annual-leave.pdf' : 
        $leave->leave_policy == '病假' ? '/documents/sick-leave.pdf' : 
        '/documents/default-leave.pdf' 
      }}" 
      class="attachment-icon-pdf mr-5"
      target="_blank">
        <i class="fa fa-file-pdf-o" aria-hidden="true"></i>
      </a>
    </td>
  </tr>
  @endforeach
</tbody>

关键说明： #

• 把原来的$leaves改成$leave（循环遍历集合时，单个元素变量名要对应）
• 用Blade三元运算符匹配不同休假类型对应的文件路径，你可以根据实际存储的休假类型和文件位置调整条件
• 添加target="_blank"让文件在新窗口打开，避免用户离开当前页面

方案二：用JavaScript控制跳转（适合需要额外逻辑的场景） #

如果需要在打开文件前做一些验证或额外处理，可以用JS来实现：

<tbody id="myTable">
  @foreach($leaves as $leave)
  <tr class="tr">
    <td class="text-center">{{ $leave->id }}</td>
    <td class="policy"><span class="leave"> {{ $leave->leave_policy }}</span> </td>
    <td>
      <a href="#" onclick="return check('{{ $leave->leave_policy }}')" class="attachment-icon-pdf mr-5">
        <i class="fa fa-file-pdf-o" aria-hidden="true"></i>
      </a>
    </td>
  </tr>
  @endforeach
</tbody>

<script>
function check(leavePolicy) {
  // 根据休假类型映射文件路径
  let fileUrl = '';
  switch(leavePolicy) {
    case '年假':
      fileUrl = '/documents/annual-leave.pdf';
      break;
    case '病假':
      fileUrl = '/documents/sick-leave.pdf';
      break;
    // 可以继续添加其他休假类型的case
    default:
      fileUrl = '/documents/default-leave.pdf'; // 默认文件
  }

  // 打开文件（新窗口）
  window.open(fileUrl, '_blank');
  // 阻止a标签默认跳转行为
  return false;
}
</script>

关键说明： #

• 在onclick里把当前休假类型作为参数传递给JS函数
• 用switch-case清晰匹配不同类型的文件路径，方便后续扩展
• return false阻止a标签默认的锚点跳转行为

最后提醒下：记得把代码里的休假类型（比如'年假'、'病假'）替换成你数据库里实际存储的值，文件路径也要和服务器上的真实位置对应哦～

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