Question

我正在尝试创建一个指针，只要输入文本被聚焦，它就会弹出。 popover的内容是html。

JS

$('.validate').popover({
    html : true,
    trigger : 'focus',
    content : function() {
        return $('#popover-content').html();
    }
});

关于更改

$('.validate').change(function() {
    var eval_me = $('.validate').val();
    $('#sample').html(eval_me);
});

HTML

    <div class="input-prepend">
        <span class="add-on"><i class="icon-lock"></i></span><input type="text" class="validate" data-placement='right' title="Hello World">
    </div>

    <div id="popover-content" style="display: none">
        <div class="row"><label id="sample">This is your div content</label></div>
    </div>

标签内的内容会更新，但弹出窗口不会更新。取消弹出窗口并再次聚焦输入文本（打开它）会显示更新的标签。

感谢任何帮助：）

Answer 1

两件事：change事件在输入失去焦点之前不会触发，您可能希望将更新代码绑定到keyup事件。其次，虽然代码是更新你的sample div，但弹出窗口只是在触发弹出框时获取数据;如果要更新popover的sample div，则需要将其作为keyup事件处理程序的一部分进行处理。尝试更改该事件处理程序，如下所示：

$('.validate').keyup(function() {
  var eval_me = $('.validate').val();
  $('#sample').html(eval_me);
  $('.popover #sample').html(eval_me);
});

你应该好。查看fiddle。

编辑：实际上玩了一下，似乎keyup是一个比keypress更好的触发器，否则更新会跟踪输入一个字符，但我可能只是在那里遗漏了一些东西。相应地更改了上面的代码。

更新Bootstrap Popover内容

1 个答案: