html - 在 jquery-mobile 中,如何以编程方式添加具有所有 css 的页面元素?

标签 html css jquery-mobile

当此代码运行时,您可以看到它不会将以编程方式添加的输入字段呈现为移动样式元素。我可以通过添加渲染页面时放入的所有类(注释掉)来强制它。有没有更简单的方法?

http://jsfiddle.net/mckennatim/KKTr4/

<!DOCTYPE html>
<html>
<head>
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.css" />
        <script src="http://code.jquery.com/jquery.js"></script>
        <script src="http://code.jquery.com/mobile/latest/jquery.mobile.js"></script>   
</head>
<body>
    <div id="thelists" data-role="page">

        <div data-role="header">
            <h1>My Title</h1>
        </div><!-- /header -->       
        <div data-role="content">   
            <h3>Add List</h3> 
            <form>
                <div data-role="controlgroup"  id="addwhat">
                    <input type="text" name="inp0" class="inp" />
                </div>  
                <div data-role="controlgroup" data-type="horizontal" class="aisubmit">
                    <input type="submit" data-theme="b" id="addinput" value="Add Input"/>
                </div>                          
             </form> 
        </div><!-- /content -->
    </div><!-- /page -->
    <script>
    var ct =0;
    $('body').on('click', "#addinput", function (e) { 
        ct++;
        e.stopImmediatePropagation();
        e.preventDefault();
        //to add form elemnt you have to add all the class css stuff
        //$('#addwhat').append('<input type="text" name="list' + ct + '" class="inp ui-input-text ui-body-c ui-corner-all ui-shadow-inset" />');
        $('#addwhat').append('<input type="text" name="list' + ct + '"/>');
    });              
    </script>    
</body>
</html>

最佳答案

$('#thelists').trigger('create');

应该可以解决问题。

关于html - 在 jquery-mobile 中,如何以编程方式添加具有所有 css 的页面元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9186801/

相关文章:

java - 用户界面 :include that doesn't throw an error if file not found

html - 将响应图像彼此相邻堆叠

javascript - 如何防止用户在发出ajax请求时与页面交互

css - Sass 错误 : Invalid CSS after "...0, 0, -5deg); }": expected 1 selector or at-rule, 是 "{"

javascript - 仅应用jquery mobile 页面的一部分?

jQuery Mobile ListView 分页

javascript - 将网络应用程序转换为移动应用程序

javascript - react - 到达特定部分时停止滚动

javascript - addClass/removeClass 单击以选择另一个 div 的数据属性

html - Web 字体在加载时闪烁