jQuery Mobile和表單提交

我已決定跳轉到支持Wordpress的移動主題的jQuery Mobile框架。jQuery Mobile和表單提交

我現在遇到提交表單與URL中的哈希標記並嘗試做驗證和ajax發佈的問題。基本上它不起作用。

例如：website.com/contact/ < - 作品 website.com/#/contact/ < - 不工作

我知道了相對= 「外部」標籤的HREF的這消除了＃從網址。但是我有一個自定義插件的博客文章，用於呈現註冊表單，我無法使用rel =「external」。我想我可以將它用於所有鏈接，但這會消除平滑過渡。

我有什麼方法可以嘗試並使其發揮作用？我試圖將.submit綁定到表單，做一些驗證然後ajax發佈它。

Update--

<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>

仍然沒有去。

（FYI了jQuery而不是$是因爲的WordPress）

--another更新。

由於我使用Wordpress的一些功能很奇怪。像is_home（）一樣。無論什麼'頁面'，我在這個功能上都會回到真實的。我認爲這與每個頁面的ajax調用有關。

來源

2011-02-08 jdruid

您可以關閉AJAX包裝。此外http://jquerymobile.com/demos/1.0a3/#docs/api/globalconfig.html

- 我已經看到了一些關於用斜槓的問題，但現在我不能找到它，所以一定要使用素α3版本JQM

的

[編輯]

此：在這裏閱讀幾次之前被提及 - 在其他一些線程中。如果你去了一個頁面，JQM使用AJAX加載它，那麼只有body被採取並且沒有document.ready，因爲dom已經準備好了;）（我在這裏引用自己）

來源

2011-02-08 17:28:50 naugtur

不知道是不是這樣。我將更改爲並添加了一個僅包含警報的點擊處理程序。不要使用網址中的＃號。沒有它是金錢。 – jdruid 2011-02-08 19:13:02

不要試圖搞亂表格。禁用AJAX應該可以工作。你可以嘗試試驗版本 - 比較jqm alpha2和alpha3的工作（謹慎：alpha2有不同的設置） – naugtur 2011-02-08 19:49:29

我並不完全確定你在哪裏打電話jQuery.ready功能，但建議註冊處理程序的方法是綁定到您的特定頁面的pagecreate事件。 pagecreate事件應僅在第一頁中由jQuery.ready處理。我最近建立了一個使用jQuery手機的網站，我遇到了這個問題。下面的代碼應該可以幫到你：

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處理的所有表單提交中。希望這個幫助！

來源

2011-09-14 23:05:49

jQuery Mobile和表單提交

回答

相關問題