0

我正在尝试使用 ajax 来显示一个网站的表单但是我失去了 JQM 样式所以它只是简单地显示我怎样才能让表单正确显示？我的代码如下

 <div data-role="page" data-add-back-btn="true" id="events">
        <div data-role="header">
            <h1 id='heading'></h1>
            <a href="#" data-rel="back" data-icon="arrow-l">Back</a>
        </div>    
    <div data-role="content" id="textcontent"></div>
 <li><a href="Javascript:form();">Contact Us</a></li>

function form()
{ 
alert("Success");
data = data + '<form action="index.html" method="post"><div data-role="fieldcontain"><label for="username">Username<label><input type="text" name="username" id="username"></form></div>'
$('#textcontent').html(data);
$('#textcontent').show();
 }

该函数被调用并且表单出现在屏幕上，但它失去了所有的 jqm 样式任何帮助将不胜感激

4

2 回答 2

0

使用trigger('create')应该可以解决问题。

function form(){ 
    data = '<form action="index.html" method="post"><div data-role="fieldcontain"><label      for="username">Username<label><input type="text" name="username" id="username"></div></form>';
    $('#textcontent').html(data);
    $('.ui-page').trigger('create');
    $('#textcontent').show();

}

其他一些可能对您有帮助的事情是

  1. 您的表单中有一个 html 错误。您的 div 必须在表单关闭之前关闭。即</div></form>应该是这样。一个<li>元素也应该被包裹在 a<ul>或 an<ol>中。
  2. 摆脱来自变量中的数据+。我不确定那是为了什么。
  3. 只需将表单放入设置为display:none. 这样就不需要 trigger('create') 方法了。然后你可以只显示（）或切换（）可见性。
于 2012-05-11T10:04:23.027 回答
0

添加$(".ui-page").trigger("create");为form().

于 2012-05-11T17:37:43.020 回答