【问题标题】:bootstrap popover content not changing引导弹出窗口内容不变
【发布时间】:2023-03-04 12:38:01
【问题描述】:

我想在同一个输入字段上显示两条不同的消息,但两个弹出框的内容消息是相同的,而实际上它们应该是不同的。第一个弹出框是当第一个字符为小写时,第二个弹出框在达到 5 个字符时触发。我看到的唯一消息是两个弹出框的小写。以下是我的代码:

JSFIDDLE

<input type="text" data-placement="bottom" data-trigger="manual" data-content="" name="momlastname" id="momlastname" ng-model="momlastname" maxlength="70" />

(function(){
      function firstCapital(e) {
                var inp = String.fromCharCode(e.which);
                if (/[A-Z]/.test(inp[0])) return true;
                else return false;
            };
    var message;
    $('#momlastname').keyup(function (f) {
                    //console.log($(this).val().length);
        switch ($(this).val().length) {
    case 1:
        message = "lower";
                break;
     case 5:
        message = "max reached";
                break;
        }


                    if ($(this).val().length == 1 && !firstCapital($(this).val())) {

                            $('#momlastname').popover({
                                trigger:'manual',
                                content:function(){
                                    return "lower letter";
                                }
                            });
                            $('#momlastname').popover('show');
                             $('#momlastname').addClass('error');

                    }
                  else if ($(this).val().length == 5) {
                            $('#momlastname').popover({
                                trigger:'manual',
                                content:function(){
                                    return message;
                                }
                            });
                            $('#momlastname').popover('show');
                            $('#momlastname').addClass('error');
                    }
                    else {
                        $('#momlastname').popover('hide');
                         $('#momlastname').removeClass('error');
                    }
                });
})();

【问题讨论】:

    标签: jquery html twitter-bootstrap popover


    【解决方案1】:

    您需要返回您的消息变量,而不是像“lower”这样的字符串。有工作示例。

    jsfiddle.net/xksfj23e/10/
    

    【讨论】:

      猜你喜欢
      • 2012-10-28
      • 1970-01-01
      • 2012-11-16
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-08-11
      • 1970-01-01
      相关资源
      最近更新 更多