源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jQuery ajax应用总结

  • 时间:2020-04-02 15:40 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jQuery ajax应用总结
[b]一、jQuery中Ajax的调用(需要引用jQuery代码库)。[/b] [b]方法1:[/b]
[u]复制代码[/u] 代码如下:
$.get(url, function(data) {         //deal with the data });
[b]方法2:[/b]
[u]复制代码[/u] 代码如下:
jQuery.post( url, [ data ], [ success(data, textStatus, jqXHR) ], [ dataType ] ) $.post(url,postdata, function(data) {  //deal with the data });
[b]方法3:[/b]
[u]复制代码[/u] 代码如下:
$.ajax({     type: "POST",// or get     contentType: "application/json; charset=utf-8",     url: url,     data: "{'countryModel':" + JSON.stringify(countryModel) + "}",     dataType: "json",//html,xml,script     async: true, //true 表示异步,默认就是true     success: function(data) {   //deal with the data      },     error: function() {         // deal with error     } });
[b]二、jQuery.Form plugin Ajax(需要引用jQuery代码库和jQuery.Form插件)[/b] 基于Form表单的Ajax调用 [b]1.ajaxForm[/b], 这个方法在调用时不是马上提交,只是说明调用的Form要以ajax方式提交,该方法一般在$(document).ready方法里设置。 [b]2.ajaxSubmit[/b],这个方法在调用时就会马上提交。
[u]复制代码[/u] 代码如下:
var options = {     target:     '#divToUpdate',     url:        'comment.php',     success:    function() {         alert('Thanks for your comment!');     } }; $('#myForm').ajaxForm(options); 或$('#myForm').ajaxSubmit(options);
[b]三、Ajax在MVC中的使用[/b] 以上两种方法都可以用, 另外我们可以MicrosoftAjax,这就必须引用MicrosoftAjax.js, MicorsoftMvcAjax.js这两个文件 [b]1.Ajax.BeginForm[/b]
[u]复制代码[/u] 代码如下:
<%using (Ajax.BeginForm("action", "controll", new AjaxOptions {   UpdateTargetId = "ajaxdiv",   HttpMethod = "POST" }, new { id = "AjaxForm" })) { %> <input type="text" id="EmployeeId2" /> <input type="submit" value="Submit" /> <%} %> <div id="ajaxdiv"> </div>
[b]2.Ajax.ActionLink[/b] <%=Ajax.ActionLink("LinkName","action", "controll", new AjaxOptions {   LoadingElementId = "loadingdiv",   UpdateTargetId = "ajaxdiv",   HttpMethod = "POST" });%> <div id="ajaxdiv"> </div> <div id="loadingdiv"> </div> [b]四、jquery.form与jquery.validate结合使用[/b] 前端代码
<script type="text/javascript" language="javascript" src="http://www.1sucai.cn/Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" language="javascript" src="http://www.1sucai.cn/Scripts/jquery.validate.min.js"></script>
<script type="text/javascript" language="javascript" src="http://www.1sucai.cn/Scripts/jquery.form.js"></script>
<h2>
  AjaxFrom</h2>
<div id="output1" style="color: Red;">
</div>
<%using (Html.BeginForm("Login", "Home", FormMethod.Post, new { id = "loginForm" }))
 { %>
<table border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td>
      <%=Html.TextBox("UserEmail", "", new { @class="name required"})%>
    </td>
  </tr>
  <tr>
    <td>
      <%=Html.Password("Password", "", new { @class = "required" })%>
    </td>
  </tr>
  <tr>
    <td>
      <input type="submit" value="submit" />
    </td>
  </tr>
</table>
<%} %>
<script language="javascript" type="text/javascript">

  $(document).ready(function () {
    var opts = {

      submitHandler: function (form) {
        var submitOpts = {
          target: '#output1',
          success: function () {
            alert('Thanks for your comment!');
          }
        };
        $(form).ajaxSubmit(submitOpts);
      }

    };
    jQuery("#loginForm").validate(opts);
  });  
</script>

后端Action
public PartialViewResult Login(string UserEmail, string Password)
{

  // you code
  return PartialView("Success");
}
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程素材网。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部