0

我做了我的家庭作业，但我无法让它工作。按钮样式不刷新请帮忙。

        <div id="qpage" data-role="page">
        <div data-role="header">
            <a id="exit-quiz" data-role="button" data-icon="arrow-l" >Exit</a>
            <h1 id="ques-title">#ques-title</h1></div>
        <div data-role="content">
            <div class="ui-bar-a" id="ques-timer">
                #ques-timer
            </div>
            <div id="question"><h3>#Question</h3></div>
            <div class=".button-set" data-role="controlgroup" id="answerbox">
                <a data-role="button" id="answer_1">#answer_1</a>
                <a data-role="button" id="answer_2">#answer_2</a>
                <a data-role="button" id="answer_3">#answer_3</a>
                <a data-role="button" id="answer_4">#answer_4</a>
            </div>
            <div id="explanation">

            </div>
        </div>
        <div data-role="footer"><h2>Copyright Kaveen</h2></div>
    </div>

这是我写的 Javascript

            $("#subject1").bind('click',function(){
            var json = $.get("test.json",function(data){
                $("#question").html(data.question);
                $("#answer_1").html(data.mcq_1);
                $("#answer_2").html(data.mcq_2);
                $("#answer_3").html(data.mcq_3);
                $("#answer_4").html(data.mcq_4);
            });

我确实试过$( "div[data-role=page]" ).page( "destroy" ).page();但它不会工作请帮助我谢谢。JSFIDDLE http://jsfiddle.net/xRTCu/

4

2 回答 2

1

Try this, it should work:

$("#answer_1").button("refresh");

If that is also not working, try this

$("#answer_1").buttonMarkup();

EDIT: jsfiddle updated http://jsfiddle.net/androdify/xRTCu/4/ Use this:

 $("#answer_1 .ui-btn-text").text(data.mcq_1);

Why? Because jquery mobile adds a span around the button which has class="ui-btn-text"

于 2013-06-21T18:42:49.667 回答
0

$( "div[data-role=page]" ).trigger ("create")如果您使用的是最新版本的 jQuery 移动版，请尝试一下。page在某些版本之前已弃用。

如果您使用的是旧版本的 jQM，那么您可以$("[data-role=button]").button().button ("refresh")在将 JSON 数据附加到这些按钮后使用。

编辑

从您的小提琴中，我可以看到您正在使用html()并且正在擦除 jQM 的标记。这就是data-role=button转换您的标记的原因：

<a data-role="button" id="answer_1">#answer_1</a>

//becomes

<a data-role="button" id="answer_1" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="c" class="ui-btn ui-shadow ui-btn-corner-all ui-first-child ui-btn-up-c">
  <span class="ui-btn-inner">
       <span class="ui-btn-text">mcq wrong</span>
  </span>
</a>

所以通过使用html()你有效地擦除里面的一切a。ui-btn-text尝试像这样在里面搜索类a，然后在其中运行html您的文本：

$(".ui-btn-text", "#answer_1").html(data.mcq_1);
//OR
$("#answer_1").find(".ui-btn-text").html(data.mcq_1);

这是您更新的演示：http: //jsfiddle.net/hungerpain/xRTCu/3/

于 2013-06-21T17:07:58.630 回答