AJAX更新的jquery移动问题

我在JQuery Mobile中的单选按钮有一个非常奇怪的问题。我正在用ajax填充一些单选按钮。当我这样做的时候第一次没问题，但随后的任何负载似乎都会导致显示问题 - 每个复选框都单独显示，而不是显示在单个列表中。AJAX更新的jquery移动问题

function getWords() { 

    var gig_id = $('#gigs').val(); 

    $.ajax({ 
     url: Nnn.serverLocation+'/words?gigid='+ gig_id, 
     success: function(data) { 
      Nnn.words = eval('(' + data + ')'); 
      displayWords(); 
     } 
    }); 
} 

function displayWords() { 
    $('#word_container').html('<fieldset data-role="controlgroup" id="words"></fieldset>'); 

    $('#words').html("<legend>It's:</legend>"); 
    $.each(Nnn.words, function(key, value) { 
     $('#words').append('<label for="'+value.Word+'" >'+value.Word+'</label><input type="radio" value="'+value.Word+'" id="'+value.Word+'" name="radio-choice-1" />');   
    }); 

    $('#words input').checkboxradio(); 

    $('body').page(); 
}

的HTML看起来像

<div id='all' data-role="page"> 

    <div data-role="content"> 


    <div data-role="fieldcontain" id='word_container'> 


     <fieldset data-role="controlgroup" id='words'> 


     </fieldset> 
    </div> 
     </div>

它的驾驶我疯了！

来源

2011-03-17 Jim

我其实有一个类似的问题，按钮 – Christian 2011-06-23 15:09:30

问题是在页面中正确加载/显示CSS。如果使用Ajax重新加载页面，则不能使用HTML5数据属性。例如，在jQueryMobile按钮控制这样表示：

<a href="index.html" data-role="button">Link button</a>

如果在Ajax调用使用相同的标记，将无法正确显示。你需要做的是，Firefox/Chrome/Opera->右键单击 - >检查元素并使用显示在那里的标记。所以，按钮控件适当的标记将是：

<a class="ui-btn ui-btn-corner-all ui-shadow ui-btn-hover-c" data-role="button" href="index.html" data-theme="c"> 
    <span class="ui-btn-inner ui-btn-corner-all"> 
    <span class="ui-btn-text">Link button</span> 
    </span> 
</a>

来源

2011-07-01 12:38:08

AJAX更新的jquery移动问题

回答

相关问题