jQuery的形式提交

我創建這個小JS，所以我可以控制的形式使用jQueryjQuery的形式提交

提交

$('#submit').click(function() { 
    $('#addForm').submit(); 

});

我可以用一個簡單的href鏈接呢？

喜歡的東西

<a href="javascript:$('#addForm').submit();">link</a>

我試圖

<a href="javascript:document.addForm.submit();">link</a>

但它並沒有（通過它傳給其他jQuery的頁面）工作

來源

2010-09-27 user186585

永遠不要把JavaScript中的href屬性。如果您必須輸入HTML，請使用onclick屬性，並記得添加return false。此外，永遠不要前綴腳本與javascript:。儘管如此，你的第一個腳本塊應該也能很好地完成這項工作。

（與「傳給其他jQuery的頁面它」是什麼意思？）

來源

2010-09-27 15:22:12

如果您想您所創建控制提交JS，不要在你的鏈接href的值：

<a id="submit">link</a>

來源

2010-09-27 15:23:20 Clicktricity

您可以使用jquery附加到click事件。它也更清潔，不要把任何JavaScript放入你的html中。

<!DOCTYPE html> 
<html> 
<head> 
<title>Sample</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
     $('#aSubmit').click(function(){ 
      $('#form1').submit(); 
      return false; 
     }); 
    }); 
</script> 
<style type="text/css"></style> 
</head> 
<body> 
    <form id="form1" action="http://www.google.com/search" name=f> 
     <input name="q" /> 
    </form> 

    <a href="#" id="aSubmit">submit</a> 
</body> 
</html>

來源

2010-09-27 15:34:57 Dan

我儘量避免代碼中的新功能 – user186585 2010-09-27 16:17:18

@ user186585爲什麼？ – alexn 2010-09-27 18:26:32

你不能以鏈接和一些javaScript甚至jQuery提交你的表單。您必須使用XHR調用來提交查詢，而不是刷新頁面。（您可以使用Dan提供的鏈接提交表單，但我知道您希望做的不僅僅是您的問題）原因是「返回false」語句會影響鏈接操作，而不是表單提交本身。無論如何，我建議你不要使用鏈接來提交表單。

你可以很容易地提交一個正常的提交按鈕和一點jQuery的形式。這樣，您可以爲尚未啓用javaScript的用戶提供良好的回退。

你甚至可以與一些客戶端驗證提交表單，使用下面的HTML/JavaScript的：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Sample</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
     $(function(){ 
      $('#addForm').submit(function(){ 
       validate(); 
       ajax_submit_function_taking_form_data_as_argument($(this).serialize()); 
       return false; 
      }); 
     }); 

     function validate(){ 
      //Do some client side validation if required 
     } 

     function ajax_submit_function_taking_form_data_as_argument(theData){ 
      $.ajax({ 
       type: 'GET', 
       url: "http://search.google.com/", 
       data: theData, 

       error: function(e){ 
        alert('error...'); 
       }, 
       success: function(data){ 
        alert('success!'); 
       } 
      }); 
     } 
    </script> 
    <style type="text/css"></style> 
</head> 
<body> 
    <form id="addForm"> 
     <input type="text" name="field1" value="" /> 
     <input type="submit" value="submit" /> 
    </form> 
</body> 
</html>

最後一種解決方案，儘管也許太重的重量爲您的使用，將是使用優秀的jQuery表格插件http://jquery.malsup.com/form/

我希望有幫助！

來源

2010-09-27 16:02:35 ekynoxe

jQuery的形式提交

回答

相關問題