Question

我正在尝试将我的网站转移到jquery mobile并在使用时遇到错误：

$('#information').load('getRegister.php'  , function() {
                    $('#preloader').hide(); 
                });

调用此函数以动态地将html代码加载到页面中而不刷新，但出现的代码与网站中已有的代码的css不匹配。您可以在 enter image description here 下面的屏幕截图中看到这一点：

我很难理解为什么，按钮和文本字段不会对已加载到页面中的表单进行样式设置。 .load调用的代码是这个php文件：

<?php
  require ('myConnectDB.inc.php');     

// echo registration form

echo "

<p class=\"center\"> &nbsp;</p>

<form name=\"input2\" action=\"\" onsubmit =  \" return register()\" method=\"post\"  data-ajax=\"false\">
                    <p class=\"center\"> User Name: 
                    <input type=\"text\" name=\"user\"  id=\"userRegister\" /></p>
                    <p class=\"center\"> &nbsp;</p>
                    <p class=\"center\"> Email: 
                    <input type=\"text\" name=\"user\"  id=\"emailRegister\" /></p>
                    <p class=\"center\"> &nbsp;</p>
                    <p class=\"center\"> Password: <input type=\"password\" name=\"password\" id=\"passwordRegister1\" /></p> 
                    <p class=\"center\"> &nbsp;</p>
                    <p class=\"center\"> Re-Type Password: <input type=\"password\" name=\"password\" id=\"passwordRegister2\" /></p> 
                    <p class=\"center\"> &nbsp;</p>
                    <p class=\"center\"> 
                    <input type=\"submit\"  class=\"  button blue\" name = \"login\" value=\"Register\" />
                    </p>
            </form>";   
?>

Answer 1

您需要在新添加的内容上触发create事件。

来自Docs

如果您应该通过生成新的标记客户端或加载内容   AJAX并将其注入页面，您可以触发create事件   处理其中包含的所有插件的自动初始化   新标记。这可以在任何元素（甚至是页面）上触发   div本身），为您节省了手动初始化每个插件的任务   （见下文）。

例如，如果加载了一个HTML标记块（比如一个登录表单）   通过Ajax，触发create事件自动转换   它包含的所有小部件（输入

和本例中的按钮）进入增强版本。代码   这种情况将是：

$( ...new markup that contains widgets... ).appendTo( ".ui-page" ).trigger( "create" );

在您的情况下，您可能会想要类似以下内容

$('#information').load('getRegister.php'  , function() {
        $('#preloader').hide(); 
        $('#information').trigger("create");
 });

Answer 2

这可能是因为你的新html没有提供与原始表单相同的类属性或原始样式表使用的任何嵌套div结构。

查看原始文本字段的class属性并匹配它们。或者查看样式表以了解如何布置HTML。

Jquery Mobile和.load函数

2 个答案: