Typeahead 从输入字段中删除顶部填充和宽度

Question

我将 Framework7 与 jQuery 和 bootstrap

一起使用

<form class="searchbar">
    <div class="searchbar-inner">
        <div class="searchbar-input-wrap">
            <input type="search" placeholder="Search Medicines" id="ahead_search">
            <i class="searchbar-icon"></i>
            <span class="input-clear-button"></span>
        </div>
        <span class="searchbar-disable-button">Cancel</span>
    </div>
</form>

现在 app.js 每当我选择元素时（尝试了 noConflict 和 $ 方法）

jQuery("#ahead_search").typeahead({....});

look/feel/ui/css/idk 该输入字段的变化

我会附上图片来说明问题

选择前：

选择后：

不仅在 framework7 中，几乎在所有情况下都会发生这种情况。

Answer 1

更新：感谢 C14L 的评论，我得以解决此问题。显然，Twitter Typeahead 使用 jquery 将一些类附加到某些元素，并为它们使用内联样式这是被主题 css 覆盖的内联样式。我们只需要 jQuery 中的一行来防止这种情况发生。所以在初始化 typeahead 之后，就这么写

jQuery('.twitter-typeahead').attr("style", "");
这将重置样式属性并将输入框恢复为原始状态。

Typeahead 从输入字段中删除顶部填充和宽度

Typeahead removing top padding and width from input field

jquery

html-framework-7