Question

嗨朋友我是jquery的新手，想要学习Ajax我开发了一个简单的代码，其中我删除了行的行，行的长度将在一个div中更新，你可以检查小提琴here或者你可以在下面看到我的代码

SCRIPT

var len = $('table tr').length;

$('.shopItems').text('items in your cart '+len);

$('.del').click(function(){

    var len = $('table tr').length;
    var len = len - 1;
    $('.shopItems').text('items in your cart '+len);
    //alert(len)




if(len == 0)
{
$('table').remove();
    $('.empty').show();
}
    else{
    $(this).parent('tr').remove();
        len--;
    }


})

HTML

<div class="shopItems"></div>

<div class="empty" >Your Cart is empty</div>

<table width="100%">
    <tr>
        <td>Image</td>
        <td>Discription</td>
        <td class="del">X</td>        
    </tr>
        <tr>
        <td>Image</td>
        <td>Discription</td>
        <td class="del">X</td>        
    </tr>
        <tr>
        <td>Image</td>
        <td>Discription</td>
        <td class="del">X</td>        
    </tr>
</table>

CSS

.empty{display:none;}

我的问题是，我可以使用Ajax做同样的事情吗？请帮助我。

提前致谢....

Answer 1

你可以把这个功能放在你的代码中：

ajaxService = (function () {
var ajaxGetJson = function (callback,  isAsyncCall) {

    //by default is an asyncrounous call
    isAsync = (typeof isAsyncCall === "undefined") ? true : isAsyncCall;

    $.ajax({
        url: "http://yourserviceorserversideapphere",
        type: "GET",
        data: request,
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        async: isAsync,
        success: function (result, statusMsg, status) //3 parameters always come from ajax
        {
            callback(result, statusMsg, status, request);
        },
        error: function (result, statusMsg, status) //3 parameters always come from ajax
        {
            ServiceFailed(result, statusMsg, status, getSvcUrl(service, method));
        } // When Service call fails
    });
};

然后在你的del按钮中：

$('.del').click(function(){
    ajaxService.ajaxGetJson(successAjaxCall, true);
}

然后你将获得你在回调函数（successAjaxCall）中传递的函数，以执行.del按钮在代码中执行的操作。

function successAjaxCall(result, statusMsg, status) {

   //you can use the result object to do anything you want here

}

使用jQuery和Ajax删除表行

1 个答案: