javascript - 取消引导标签的显示事件

我正在使用 bootstrap 选项卡，并且我使用 shown 事件来检测选项卡更改，在我想取消显示的情况下，即使我使用了 preventDefault() 函数，如下所示:

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
    var target = $(e.target).attr("href") // activated tab
    if(target === '#mise-en-page' || target === '#widgets'){
        if($('.page-name-input').length > 0){
            var nonEmpty = $('.page-name-input').filter(function(){
                return this.value != '';
            });
            if(nonEmpty.length==0){
                e.preventDefault();
                console.log('Error !!');
            }else{
                console.log('OK');
            }
        }else{
            console.log('OK');
        }
    };
  });

在这种情况下，preventDefault() 函数不起作用，即使控制台上打印了 'Error !!' 消息，我仍然可以在选项卡之间导航。
我该如何解决这个问题？
编辑 :
这是一个 jsfiddle，其中 preventDefault() 不适用于显示的事件。
http://jsfiddle.net/xFW8t/2426/

最佳答案

这是因为 fiddle 没有正确包含 bootstrap.js
当包含 js 时，e.preventDefault 工作正常..

http://www.codeply.com/go/FiyO9EGNC0(css、js 和 jquery 都包含在 Codeply 中)

由于数据属性，选项卡在没有 js 的情况下仍然可以工作，但是在没有 bootstrap.js 的情况下事件将无法工作

Updated fiddle

关于javascript - 取消引导标签的显示事件，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42224524/