首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >jQuery移动版和表单提交

jQuery移动版和表单提交
EN

Stack Overflow用户
提问于 2011-02-09 00:55:55
回答 2查看 22.2K关注 0票数 5

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

我现在遇到了在url中使用hash标签提交表单的问题,并试图进行验证和ajax发布。基本上它不起作用。

例如: website.com/contact/ <- works website.com/#/contact/ <-不工作

我知道href的rel="external“标记去掉了url中的#。但我有博客帖子与一个自定义插件,呈现注册表单,我将无法使用rel=的“外部”。我想我可以对所有的链接使用它,但这会消除平滑的过渡。

我有什么选择来尝试让它工作吗?我正在尝试将.submit绑定到表单,做一些验证,然后ajax post它。

更新--

代码语言:javascript
复制
<form id="myform" action="myfile.php" method="post">
<input type="text" id="mytext" name="mytext" />
<input type="submit" id="myform_submit" value="Submit">
</form>

还有我的脚本:

代码语言:javascript
复制
jQuery(document).ready(function() { 
 jQuery("#contact_submit").submit(function(){
        alert('WTF');
        }); 
 });

更改为:

代码语言:javascript
复制
<form id="myform" action="myfile.php" method="post">
<input type="text" id="mytext" name="mytext" />
<input type="button" id="myform_submit" value="Submit">
</form>

还有我的脚本:

代码语言:javascript
复制
jQuery(document).ready(function() { 
 jQuery("#contact_submit").click(function(){
        alert('WTF');
        }); 
 });

两者都不适用于url中的#。

我还在jquery.mobile.js文件之前添加了以下内容:

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

还是不能走。

(仅供参考,jQuery而不是$是因为WordPress)

--另一个更新。

由于我使用的是Wordpress,一些函数表现得很奇怪。比如is_home()。无论我在哪个页面上,函数返回的结果都是真的。我认为这与每个页面的ajax调用有关。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2011-02-09 01:28:51

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

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

编辑

这在之前已经被提到过几次了--在其他一些帖子中。如果您转到一个页面并使用AJAX加载JQM,那么只接受body而不触发document.ready,因为dom已经准备好了;) (我在这里引用自己的话)

票数 2
EN

Stack Overflow用户

发布于 2011-09-15 07:05:49

我不能完全确定您在何处调用jQuery.ready函数,但推荐的注册处理程序的方式是绑定到特定页面的pagecreate事件。jQuery.ready应该只在第一个页面中处理pagecreate事件。我最近用jQuery手机建立了一个网站,我就遇到了这个问题。下面的代码应该会让你到达你想要的地方:

代码语言:javascript
复制
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处理的所有表单提交中。希望这对你有所帮助!

票数 7
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/4935887

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档