Laravel中点击锚点时如何通过路由参数传递输入框值到控制器

嘿，我来帮你搞定这个问题～你当前的锚点标签是静态写死的路由参数，没法自动获取输入框里的动态值，所以得做些调整，下面给你两种常用的实现方式：

方法一：用JavaScript动态拼接路由（适合保留锚点标签的场景） #

这种方式会监听锚点的点击事件，实时获取输入框的值，然后跳转到正确的路由地址。

1. 修改HTML结构（给元素加ID方便获取） #

<input type="text" name="sender_address" id="sender_address" value="Alberta" class="form-control margin-bottom-20 hide" style="border:1px solid brown;" placeholder=" Enter & Save address">
<a href="#" id="save-address-link">Save Address</a>

2. 添加JavaScript逻辑 #

// 监听锚点点击事件
document.getElementById('save-address-link').addEventListener('click', function(e) {
    // 阻止默认的跳转行为
    e.preventDefault();
    
    // 获取输入框的值，去除首尾空格
    const address = document.getElementById('sender_address').value.trim();
    
    // 校验输入是否为空
    if (!address) {
        alert('请先填写地址哦！');
        return;
    }
    
    // 编码参数（避免特殊字符导致路由错误），然后跳转到目标路由
    window.location.href = `/sender_address/${encodeURIComponent(address)}`;
});

3. 定义Laravel路由 #

在routes/web.php中添加对应的GET路由：

use App\Http\Controllers\YourController; // 替换成你的控制器名称

Route::get('/sender_address/{sender_address}', [YourController::class, 'saveAddress']);

4. 控制器接收参数 #

在你的控制器中定义处理方法，直接接收路由参数：

public function saveAddress(string $sender_address)
{
    // 这里可以处理地址的保存逻辑，比如存入数据库
    // 测试输出参数
    dd('收到的地址：' . $sender_address);
}

方法二：用表单GET提交（无需JavaScript，更原生） #

如果不想写JS，也可以把输入框放到表单里，用GET提交的方式传递参数：

1. 修改为表单结构 #

<form action="/sender_address" method="GET">
    <input type="text" name="sender_address" value="Alberta" class="form-control margin-bottom-20 hide" style="border:1px solid brown;" placeholder=" Enter & Save address">
    <!-- 把锚点换成按钮，样式可以调成和锚点一样 -->
    <button type="submit" style="background:none; border:none; color:blue; text-decoration:underline; cursor:pointer;">Save Address</button>
</form>

2. 调整Laravel路由 #

不需要路由参数，直接接收请求参数：

use App\Http\Controllers\YourController;

Route::get('/sender_address', [YourController::class, 'saveAddress']);

3. 控制器接收参数 #

通过Request类获取表单提交的参数：

use Illuminate\Http\Request;

public function saveAddress(Request $request)
{
    // 获取输入框的值
    $senderAddress = $request->input('sender_address');
    
    // 处理逻辑
    dd('收到的地址：' . $senderAddress);
}

注意事项 #

• 如果是写入/修改数据的操作（比如保存地址到数据库），更推荐用POST方法，避免浏览器缓存或误触发重复提交，此时需要把路由改成Route::post(...)，表单的method也改成POST，并且记得添加CSRF令牌（Laravel中表单POST需要@csrf指令）。
• 用JS拼接参数时，一定要用encodeURIComponent()编码，避免地址中的特殊字符（比如空格、&、/等）破坏路由结构。

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