代码之家 › 专栏 › 技术社区 › Nezir

HTML元素附加上的引导模式缺少CSS

twitter-bootstrap css html jquery javascript

Nezir · 技术社区 · 7 年前

我有一个带有引导模式窗口的网站。在呈现这些模式窗口的服务器上,一切正常,但是在加载(附加)新项目及其模式窗口之后,不知何故附加的模式没有引导CSS。

步骤:

在GridView中打开网页显示30个项目块
单击任何块显示具有正确CSS的模式
点击“加载更多”,我使用Ajax调用获取更多信息页面上的项目和服务器为这些项目生成的HTML,然后附加到特定的分区。
正确附加的项目,但单击附加的项目模式窗口缺少CSS。

可能我需要在将新项目添加到页面后调用引导CSS或JS?

2 回复 | 直到 7 年前

Mayur Patil 7 年前

这里是按ID标识元素。这就是为什么jquery选择器只取第一个匹配的元素而忽略其他元素的原因。要解决此问题,请使用类来标识jquery选择器中的元素。

Nezir 7 年前

我在这里找到了答案: bootstrap toggle doesn't work after ajax load

我的实际修复是在Ajax成功后重新加载属性:

  setTimeout(function(){ 
     // add an element dynamically,
     // now that we have dynamically loaded elements
     // we need to initialize any toggles that were added
     // you shouldn't re-initialize any toggles already present
     // but we also do want to have to figure out how to find the ones we added
     // instead, we'll destroy all toggles and recreate all new ones
     $("[data-toggle='toggle']").bootstrapToggle('destroy')                 
     $("[data-toggle='toggle']").bootstrapToggle();
     $('.tags-list').tagsinput('refresh');

 }, 1000)

推荐文章