Laravel中点击按钮后页面自动重载且获取空数据的问题咨询

我来帮你分析几个可能导致这个问题的原因，以及对应的解决办法：

1. 缺少Laravel必需的CSRF令牌 #

Laravel默认会校验所有POST请求的CSRF令牌，如果你的表单里没有添加这个令牌，请求会被框架拦截，导致提交后数据无法被后端接收，甚至触发页面重载。

解决办法：在Blade表单中添加@csrf指令，确保表单结构类似这样：

<form action="" method="" name="formpost">
    @csrf
    <!-- 你的表单输入元素、按钮等内容 -->
</form>

2. 表单元素未设置name属性 #

你的checktable()函数检查的是.table类元素的值，但如果这些元素没有设置name属性，提交表单时浏览器不会把它们的数据发送到后端，自然会出现空数据的情况。

解决办法：给需要提交的表单元素添加对应的name属性，比如：

<input type="text" class="table" name="table_content">

3. 按钮默认提交行为未阻止 #

如果你的按钮是原生<button>标签，它的默认类型是submit，点击时会触发表单的默认提交动作，这会和你JS里的自定义提交逻辑冲突，导致页面提前重载，数据还没正确处理就被提交了。

解决办法：在JS的点击事件中添加event.preventDefault()阻止默认行为：

$('button[name="postname"]').click(function(event){
    event.preventDefault(); // 阻止按钮默认提交行为
    var img_route=$(".template").attr("href");
    if(typeof img_route ==='undefined'|| img_route === null){
        alert('Please upload image')
    }else{
        var checkresult=checktable();
        if( checkresult == 1){
            document.formpost.action="postNews";
            document.formpost.method="post";
            document.formpost.submit();
        }
    }
});

4. 表单提交路径或路由配置问题 #

你JS里设置的表单action是postNews，这是相对路径，需要确保Laravel后端有对应的POST路由配置，否则请求会返回404错误，表现为页面重载且后端拿不到数据。

解决办法：在routes/web.php中添加对应的路由：

use App\Http\Controllers\YourController;

Route::post('/postNews', [YourController::class, 'postNews']);

（记得把YourController替换成你实际的控制器类名）

5. 表单校验逻辑存在漏洞 #

当前的checktable()函数只检查第一个.table元素的值，如果页面中有多个.table类的表单元素，只要第一个有值就会返回通过，但其他元素可能为空，导致提交的数据不完整。

解决办法：修改校验函数，确保所有.table元素都不为空：

function checktable(){
    var isValid = true;
    $(".table").each(function() {
        if ($(this).val().trim() === '') {
            isValid = false;
            return false; // 跳出循环，不再检查其他元素
        }
    });
    return isValid ? 1 : 0;
}

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