Question

我决定跳转到支持Wordpress的移动主题的jQuery Mobile框架。

我现在遇到了在网址中使用哈希标记提交表单并尝试进行验证和ajax发布的问题。基本上它不起作用。

例如：website.com/contact/＆lt; - 作品 website.com/#/contact/＆lt; - 无效

我知道href的rel =“external”标签消除了url中的＃。但我有一个自定义插件的博客文章，呈现注册表单，我将无法使用rel =“external”。我想我可以将它用于所有链接，但这会消除平滑过渡。

我有什么选择尝试让它发挥作用？我试图将.submit绑定到表单，做一些验证然后ajax发布它。

更新 -

<form id="myform" action="myfile.php" method="post">
<input type="text" id="mytext" name="mytext" />
<input type="submit" id="myform_submit" value="Submit">
</form>

和我的剧本：

jQuery(document).ready(function() { 
 jQuery("#contact_submit").submit(function(){
        alert('WTF');
        }); 
 });

将其更改为：

<form id="myform" action="myfile.php" method="post">
<input type="text" id="mytext" name="mytext" />
<input type="button" id="myform_submit" value="Submit">
</form>

和我的剧本：

jQuery(document).ready(function() { 
 jQuery("#contact_submit").click(function(){
        alert('WTF');
        }); 
 });

两者都不能与网址中的＃一起使用。

我还在jquery.mobile.js文件中添加了这个：

<script type="text/javascript">
jQuery(document).bind(
   "mobileinit", function(){
   jQuery.extend( jQuery.mobile, { ajaxFormsEnabled: false });
   });
</script>

仍然没有。

（仅供参考，而jQuery而不是$是因为WordPress）

- 另一次更新。

由于我使用的是Wordpress，因此其中一些功能很奇怪。和is_home（）一样。无论我在哪个“页面”，该函数都会恢复正常。我认为这与每个页面的ajax调用有关。

Answer 1

我不完全确定您在哪里调用jQuery.ready函数，但注册处理程序的推荐方法是绑定到特定页面的pagecreate事件。 pagecreate事件应仅在第一页中由jQuery.ready处理。我最近使用jQuery mobile构建了一个站点，我遇到了这个问题。以下代码可以帮助您实现目标：

jQuery(document).ready(function() {
    $("#id_of_page").live('pagecreate', function() {
        $("form").submit(function(event) {
            event.stopPropagation();
            event.preventDefault();

            // Do stuff here (usually AJAX);

            return false;
        });
    });
});

不幸的是，我没有足够的实验来确定是否所有这些都是必要的。我知道这对我有用。我差点将return false添加到由AJAX处理的所有表单提交中。希望这有帮助！

Answer 2

您可以关闭AJAX包装。请在此处阅读：http://jquerymobile.com/demos/1.0a3/#docs/api/globalconfig.html

另外 - 我已经看到了关于斜杠问题的一些事情，但现在我找不到了，所以一定要使用alpha3版本的JQM

[编辑]

之前曾提到过几次 - 在其他一些帖子中。如果你去一个页面并且JQM用AJAX加载它，那么只有body被采用而且没有文件。已经激活，因为dom已经准备就绪;）（我在这里引用自己）

jQuery Mobile和表单提交

2 个答案: