首页 \ 问答 \ Jquerymobile按钮仅显示页面的第一个外观(Jquerymobile buttons are shown only first apperance of the page)

Jquerymobile按钮仅显示页面的第一个外观(Jquerymobile buttons are shown only first apperance of the page)

我有jquery移动代码的问题。 我正在使用上面的代码为我的应用程序添加动态html代码。

$("#tab3").click(function() {
    $('#HaberIcerik').html(" <img src='img/izto_header.png' height=auto width=100% class='img2'  > ");
    $('#HaberIcerik').append("  <div class='zoomTab'><a href='#' data-role='button' class='plus'>+</a><a href='#' data-role='button' class='minus'>-</a></div>");
});

当页面首先加载时,一切都很完美。 但是,当我移动到主页面并再次单击我的tab3页面时,按钮仅显示为链接,而不是按钮样式。

你能帮我解决这个问题吗?


I have a problem with jquery mobile code. I am using the code above to append a dynamic html code for my application.

$("#tab3").click(function() {
    $('#HaberIcerik').html(" <img src='img/izto_header.png' height=auto width=100% class='img2'  > ");
    $('#HaberIcerik').append("  <div class='zoomTab'><a href='#' data-role='button' class='plus'>+</a><a href='#' data-role='button' class='minus'>-</a></div>");
});

When the page loads first, everything works perfectly. However when I move to the main page and click my tab3 page again buttons are shown only as links,not with button styles.

Can you help me to solve this problem?


原文:https://stackoverflow.com/questions/17511663
更新时间:2020-11-02 16:11

最满意答案

在您的代码中,您没有刷新按钮的样式。 所以,你必须在append()之后添加它

  $(document).on("click", "#tab3", function (e) {
        e.preventDefault();
        $('#HaberIcerik').html("<img src='http://www.ndaccess.com/Sample/Images/Image1.jpg' height=auto width=100% class='img2' > ");
        $('#HaberIcerik').append("<div class='zoomTab'><a href='#' data-role='button' class='plus'>+</a><a href='#' data-role='button' class='minus'>-</a></div>").promise().done(function () {
            //wait till everything is appended
            $(this).find("a").buttonMarkup("refresh");
        });
    });

有关更多信息,请参阅docs: http//api.jquerymobile.com/button/#method-refresh

这是一个演示: http//jsfiddle.net/hungerpain/cTdkN/


In your code you're not refreshing your button's styles. So, you must add it after append()

  $(document).on("click", "#tab3", function (e) {
        e.preventDefault();
        $('#HaberIcerik').html("<img src='http://www.ndaccess.com/Sample/Images/Image1.jpg' height=auto width=100% class='img2' > ");
        $('#HaberIcerik').append("<div class='zoomTab'><a href='#' data-role='button' class='plus'>+</a><a href='#' data-role='button' class='minus'>-</a></div>").promise().done(function () {
            //wait till everything is appended
            $(this).find("a").buttonMarkup("refresh");
        });
    });

For more info see docs : http://api.jquerymobile.com/button/#method-refresh

And here's a demo : http://jsfiddle.net/hungerpain/cTdkN/

2013-07-07

相关问答

更多

使用Modernizr检测-webkit-apperance(Detecting for -webkit-apperance with Modernizr)

我很确定Modernizr还没有包含这个功能的检测程序 - 它太新了。 但是,由于它是一个CSS属性,您应该能够自己非常简单地检测它,而无需调用modernizr。 此页面详细介绍了如何快速检查以检测CSS属性是否可用。 只需检查属性是否存在于任何给定DOM元素的style属性中。 如果属性受支持,它将在DOM中,即使它实际上没有设置为任何东西。 希望有所帮助。 I'm pretty certain that Modernizr doesn't include a detection routin ...

背景图像不显示在android phonegap jquerymobile应用程序(Background image not shown in android phonegap jquerymobile app)

我猜你的url(img/alpettalownologo.jpg)不正确,因为这意味着它位于CSS文件的子目录中。 背景图像的位置需要与特定的CSS文件相关,因此根据您的文件结构,可能会将url(../img/alpettalownologo.jpg)视为猜测。 I'm guessing your url(img/alpettalownologo.jpg) is not correct as this would mean it's in a sub directory of your CSS f ...

为什么jQueryMobile重新加载对话框上的页面?(Why is jQueryMobile reloading the page on dialog close?)

这似乎是一个错误,我已经为github上的jquery-mobile和补丁打开了一个问题 。 jQuery Mobile's website does the same thing so it must be the default behavior.

ViewExpiredException错误页面未显示(ViewExpiredException error page not shown)

如果你看一下JSF-2.2规范的 13.3.6.3和13.3.6.4节,这是预期的行为,至少如果你有 <context-param> <param-name>javax.faces.PROJECT_STAGE</param-name> <param-value>Development</param-value> </context-param> 在您的web.xml (它默默地忽略生产模式中的错误)。 单击该按钮并接收时,JSF客户端代码发送AJAX请求 <error> <err ...

JQueryMobile按钮并单击(JQueryMobile buttons and clicking)

您的问题是,在绑定事件时,绑定它的元素还不是DOM一部分。 您需要确保在绑定事件时,通过在ready事件或JQM页面的pageinit中调用函数,元素已经是DOM的一部分,或者您可以通过调用重载版本来使用事件委派。 .on功能。 例如 在pageinit事件期间绑定(这也确实使用事件委托绑定到pageinit事件)。 //passing in the selector as the second parameter calls the overloaded version of .on $(doc ...

jQueryMobile - 列表视图的上/下按钮(jQueryMobile - up/down button for listview)

不是一个简单的答案。 工作示例: https : //jsfiddle.net/Twisty/t1ruyg11/16/ 移动测试: https : //jsfiddle.net/Twisty/t1ruyg11/16/show/ HTML <div data-role="page"> <div data-role="header"> <h1>jQuery mobile Listview with drag and drop</h1> </div> <div data-role=" ...

使Firefox SDK面板适合每个外观(Making Firefox SDK panel fit on every apperance)

我通过电子邮件向William Bamberg发送了MDN示例的来源,他意识到了这个问题。 如果有人也试图这样做,问题是面板的总大小(包括填充和边距)被设置为列表元素的大小,每次都会挤压列表元素。 修复这个是一个相对简单的CSS更改: html, body, ul { margin: 0; padding: 0; list-style: none; } ul { display: inline-block; } I emailed William Bamberg ...

icarousel没有显示(icarousel not shown)

您是否尝试在数据源方法中放置断点以查看它们是否被调用? 如何使用调试器检查您的iCarousel视图上是否已正确设置轮播的dataSource属性? 我的猜测是dataSource没有被正确绑定,但如果没有更多信息,很难确定。 Have you tried putting break points inside your datasource methods to see if they're being called? How about using the debugger to check ...

Jquerymobile按钮仅显示页面的第一个外观(Jquerymobile buttons are shown only first apperance of the page)

在您的代码中,您没有刷新按钮的样式。 所以,你必须在append()之后添加它 $(document).on("click", "#tab3", function (e) { e.preventDefault(); $('#HaberIcerik').html("<img src='http://www.ndaccess.com/Sample/Images/Image1.jpg' height=auto width=100% class='img2' > "); ...

JQueryMobile - 在转换之前动态加载页面(JQueryMobile - Dynamicly load page before transition)

jsonp请求不支持同步操作, 在第二页加载您的数据。它将运作良好。 jsonp requests do not support synchronous operation, load your data in second page.it will work well.

相关文章

更多

最新问答

更多
  • 如何保护Solr只允许SELECT请求给用户并禁止其他任何东西?(How to secure Solr to allow SELECT request to only users and disallow anything else?)
  • XPath表达式无效/错误TFHpple SWIFT 1.2(XPath Expression not working/incorrect TFHpple SWIFT 1.2)
  • css3 3D变换不能平滑地制作动画(css3 3D transform doesn't animate smoothly)
  • 运行时错误'91'和Outlook.Application = <对象变量或没有设置块变量>?(Run-time error '91' & Outlook.Application = Object variable or With block variable not set?)
  • 慢的webservice问题(Slow webservice problem)
  • textview的不正确对齐方式(Improper alignment of a textview)
  • 在第一步“Hello World”中出现Java错误(Cannot run “Hello World” program in Eclipse)
  • 为什么十六进制地址是14个字符?(why the hex address is 14 character?)
  • 如何在Python中的不同类中使用变量?(How to use variable in different classes in Python?)
  • asp:GridView HYPERLINKFIELD - datanavigateurlformatstring中的asp代码(asp:GridView HYPERLINKFIELD - asp code inside datanavigateurlformatstring)
  • 关于adaboost算法(About adaboost algorithm)
  • 在Matlab上内置图像(Built in Images on Matlab)
  • java swing:输入键事件时焦点丢失(java swing: Focus lost on enter key event)
  • C#中的通用约束,T是相同的TSomethingElse,对吧?(Generic constraints in C#, T is the same TSomethingElse, right?)
  • 从mybatis中的光标获取数据(Fetching data from cursor in mybatis)
  • 在运行时从XML构建对象的最佳方法(Best way for building objects out of XMLs at runtime)
  • 在整个窗口中拉伸sf :: Sprite(Stretch sf::Sprite across entire window)
  • Selenium Node API Web驱动程序等待超时处理程序(Selenium Node API web driver wait timeout handler)
  • 函数使用并且是map的一部分(循环依赖?)(Function uses and is part of map (circular dependency?))
  • 是否可以在C ++ 14中使用可选模板参数创建类型元组?(Is possible to make a tuple of types with optional template parameters in C++14?)
  • PHP从窗帘后面打印/ f(PHP prints /f from behind the curtains)
  • JFrame的contentPane的LayoutManager(LayoutManager of JFrame's contentPane)
  • 用于Instagram Feed的图像滚动(Image Roll Overs for Instagram Feed)
  • 如何显示拉伸字体(双倍宽度/高度)?(How to display stretched font (double width/height)?)
  • 文件操作API在fileapi.h和stdio.h中的WP8差异?(WP8 differences between file manipulation APIs in fileapi.h and stdio.h?)
  • 保存失败后Rails没有回滚事务()(Rails not rolling back transaction after failed save())
  • jqgrid中的分页问题与数组数据(Pagination problem in jqgrid with array data)
  • 重定向时,通过其他页面上的URL调用javascript函数(Call javascript function through url on otherpage while Redirecting)
  • 如何使用InvokeCommandAction调用我的方法并传入参数?(How do I go about using InvokeCommandAction to call a method of mine and pass in parameters?)
  • Jquerymobile按钮仅显示页面的第一个外观(Jquerymobile buttons are shown only first apperance of the page)