使用文本鏈接作爲按鈕在jquery/ajax

-1

我已經下載了一個正常的按鈕ajax/jquery conatct窗體。但我想用文本鏈接替換按鈕。我一直在嘗試網絡上的一些建議，但他們都沒有效果。使用文本鏈接作爲按鈕在jquery/ajax

任何幫助將不勝感激。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function(){ 
    $('#contact_form').submit(function(e){ 
     e.preventDefault(); 
     var form = $(this); 
     var post_url = form.attr('action'); 
     var post_data = form.serialize(); 
     $('#loader', form).html('<img src="loader.gif" /> Please Wait...'); 
     $.ajax({ 
      type: 'POST', 
      url: post_url, 
      data: post_data, 
      success: function(msg) { 
       $(form).fadeOut(500, function(){ 
        form.html(msg).fadeIn(); 
       }); 
      } 
     }); 
    }); 
}); 
</script> 
</head> 
<body> 
<form action="process.php" method="post" id="contact_form"> 
    <div> 
     <label for="name">Your Name:</label> 
     <input type="text" name="name" id="name" value="" tabindex="1" /> 
    </div> 
    <div> 
     <label for="email">Your Email:</label> 
     <input type="text" name="email" id="email" value="" tabindex="2" /> 
    </div> 
    <div> 
     <label for="message">Message:</label> 
     <textarea cols="40" rows="8" name="message" id="message"></textarea> 
    </div> 
    <div id="loader"> 
     <input type="submit" value="Submit" /> 
    </div> 
</form> 
</body> 
</html>

來源

2012-07-16 John Smith

HTML

<div id="loader"> 
    <a href="#" class="submit">Submit</a> 
</div>

$(function(){ 
    $('#contact_form').submit(function(e){ 
     e.preventDefault(); 
     var form = $(this); 
     var post_url = form.attr('action'); 
     var post_data = form.serialize(); 
     $('#loader', form).html('<img src="loader.gif" /> Please Wait...'); 
     $.ajax({ 
      type: 'POST', 
      url: post_url, 
      data: post_data, 
      success: function(msg) { 
       $(form).fadeOut(500, function(){ 
        form.html(msg).fadeIn(); 
       }); 
      } 
     }); 
    }).delegate('a.submit', 'click', function() { 
     $(this).closest('form').submit(); 
     return false; 
    }); 
});

來源

2012-07-16 07:30:04 Simon

如果你只想替換爲<a />標籤的提交按鈕：

在你的HTML，更換<input />標籤：

<div id="loader"> 
    <!-- <input type="submit" value="Submit" /> --> 
    <a id="yourID" href="" >Your Text</a> 
</div>

附加一個事件處理程序，以新的<a />使用jQuery標記：

$("#yourID").on("click",function(){ 
    $("#contact_form").trigger("submit"); 
});

來源

2012-07-16 07:28:25 jbrtrnd

替換的按鈕與

<a href="#" id="submit">Submit</a>

然後用下面的代碼（後您的表格Ajax代碼或之前）

$('#submit').click(function (e){ 
    e.preventDefault(); 
    $('#contact_form').submit(); 
});

來源

2012-07-16 07:28:42

使用文本鏈接作爲按鈕在jquery/ajax

回答

相關問題