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
最满意答案
在您的代码中,您没有刷新按钮的样式。 所以,你必须在
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/