Question

当验证返回false时，我在启动输入字段的bootstrap工具提示时遇到问题。

更多详情：

我有想法使用javascript函数验证我的表单，这非常有效但是当验证为false时必须发生一些事情。

我正在考虑bootstrap工具提示，简单，易于控制，现在是我的最佳解决方案（如果是这样的，但实际上是用于表单的验证和气球）

我在javascript onsubmit表单中的代码：

function validateFault() {
    var phone_number = document.getElementById("phone_number").value;

    var phone_number_regex = new RegExp("^([+]?[1]?[0-9]{9,15})$");

    $('#phone_number').tooltip('destroy');
    if (!phone_number) {
        $('#phone_number').tooltip({placement: 'right', title: 'phone number is required', trigger: 'manual'}).tooltip('show');
    }
    else {
        if (!phone_number_regex.test(phone_number)) {
            $('#phone_number').tooltip({placement: 'right', title: 'allowed phone number format: +999999999 (9-15 digits with possible plus)', trigger: 'manual'}).tooltip('show');
        }
    }

    return false;
}

因此，在我的表单中单击提交按钮并且它正在两次工作时返回此函数。

当我没有任何电话号码时，我的工具提示带有“需要电话号码”的文字，当我在那里写东西时，我会在工具提示中显示第二个文字。

但是当我第二次点击时，当显示工具提示时出现此错误：

Uncaught TypeError: Cannot read property 'trigger' of null
    at HTMLDivElement.q (bootstrap.min.js:6)
    at HTMLDivElement.e (jquery.min.js:3)
    at HTMLDivElement.handle (bootstrap.min.js:6)
    at HTMLDivElement.dispatch (jquery.min.js:3)
    at HTMLDivElement.q.handle (jquery.min.js:3)
    at Object.trigger (jquery.min.js:4)
    at HTMLDivElement.<anonymous> (jquery.min.js:4)
    at Function.each (jquery.min.js:2)
    at r.fn.init.each (jquery.min.js:2)
    at r.fn.init.trigger (jquery.min.js:4)

可能问题在于没有正确启动工具提示，因为我的输入字段或我的destroy命令中没有任何工具提示注释。

但我不知道如何在工具提示中更改标题并在第二次字段验证后再次显示。

如果有人可以帮助我，或者更好地将这个验证错误显示为气球，我将不胜感激。

Answer 1

$('#phone_number').attr('data-original-title', 'phone number is required')
                  .tooltip('fixTitle')
                  .tooltip('show');

这是我的问题的答案，我在这一刻搜索了它，但也许有人有同样的问题

没有任何销毁选项和其他任何内容，在提交

上更改工具提示的标题

但重要的是＆＃39; data-original-title＆＃39;因为＆＃39; title＆＃39;这不像我想要的那样工作。

使用bootstrap工具提示进行Javascript验证

1 个答案: