js阻止表单提交

以下情况只针对非前后端完全分离！

<a href="'.Yii::app()->createUrl().'" class="label label-sm label-warning" style="width: 80px">查看订单</a>

若想要阻止上述代码的表单提交，可以做如下修改

<a href="'.Yii::app()->createUrl().'" class="label label-sm label-warning" style="width: 80px" onclick="return false;">查看订单</a>

新加了

onclick="return false;"

当你点击链接的时候确实不会实现跳转进行表单提交，但是如何做才能让这个既有拦截判断数据，又能实现表单提交呢

可以这么操作，由于可以在HTML标签里面嵌套php代码，作如下修改

<a href="'.Yii::app()->createUrl().'" class="label label-sm label-warning" style="width: 80px" onclick="'.$flag.'">查看订单</a>

其中的 $flag 是通过php进行判断后赋值的变量，如下：

$flag= a == 1 ? 'return false;' : '';

这样操作之后，在Controller中处理后标签元素并传到View，如果变量不符合要求，直接return false，不让其提交表单，那阻止表单提交后怎么让浏览器弹出alert呢？

可以在对应的View里面写js方法，判断标签<a>点击后的处理事件

$(".label").on('click', function () {
    if (不满足条件){
        alert('');
        return false;
    }
});

因为在Controller中你已经处理好元素是否能提交表单了，所以这里仅仅需要弹出alert就可以了，没有阻止表单提交的<a>标签自然不会进入到if判断里面，点击后即刻跳转提交表单

 

 

前后端完全分离的话，直接阻止表单提交，在js里面写按钮的点击事件，通过ajax进行表单提交，当然，数据处理可以在js里面直接处理，也可以通过ajax提交数据，通过接口返回的值来决定要不要继续提交表单