将Jquery更改为AJAX url GET

时间:2013-07-28 12:28:44

标签: php jquery ajax

首先,我要为标题道歉而无法道歉。

我是ajax的新手,我想将我的jquery更改为ajax。我想在同一个jquery中执行它,但我使用的jquery已经有url,我不认为你可以同时使用两个url

我当前的jquery 这是有效的,如果您理解这一点,您应该能够理解我想要的内容

$(document).ready(function(){
    $('#selected').hide();
    $('#button').click(function(){
        var pid = $('#pid').val();
        var length = $('#length').val();
        var Category = $('#Category').val();
        var Qty = $('#Qty').val();
        var qty = $('#Qty').val();
        var price = '\u00A3' + parseInt($('#pricetag').text().replace(/^\D/, ''), 10) * qty;
        var category = $('#Category').text();
        var length = $('#length').val();
        if (!/^[1-9]\d?$/.test(Qty)){
            alert('Quantity should not be below 1 or null');
            return false; // don't continue
        }
        else {
        $('#sprice').text(price);
        $('#scategory').text(category);
        $('#slength').text(length);
        $('#selected').slideDown();
        }
        $.ajax({
            url: 'cart.php',
            type: 'POST',
            data: { pid:pid, 
            length:length, 
            Qty:Qty, 
            Category:Category },
            success: function(data)
            {

            }
        });
    });
});

如果您发现我需要隐藏名为div的{​​{1}}。这不是正确的做法。

我选择的div

selected

我尝试在w3school上找到的这个ajax代码

         <div class="slidingDiv" id='selected'>
    <table class="tableclass">
        <tr>
            <td>Price:</td>
            <td id='sprice'></td>
        </tr>
        <tr>
            <td>Category:</td>
            <td id='scategory'></td>
        </tr>
        <tr>
            <td>Length:</td>
            <td id='slength'></td>
        </tr>
    </table>
</div>

但它没有用,因为我缺乏经验。

我想要

我不想隐藏function showitem(str) { var xmlhttp; if (str.length==0) { document.getElementById("showtxt").innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("showtxt").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","showitem.php?pid="+str,true); xmlhttp.send(); } ,因为如果你禁用了javascript就会显示。

我打算做什么。如果你在使用ajax单击添加按钮selected时,它会将长度,pid,类别和数量发送到onclick,并在此showitem.php中计算乘法价格*数量然后回显进入

showitem.php

showitem.php即可

<table class="tableclass">
        <tr>
            <td>Price:</td>
            <td id='sprice'></td>
        </tr>
        <tr>
            <td>Category:</td>
            <td id='scategory'></td>
        </tr>
        <tr>
            <td>Length:</td>
            <td id='slength'></td>
        </tr>
    </table>

请帮帮我。如果您不理解这个问题,请发表评论,我会尝试更详细地解释它

1 个答案:

答案 0 :(得分:0)

您应该使用Jquery为您处理所有已完成的Ajax内容,这是示例Jquery Ajax代码

var price = $('#sprice').html();
var length = $('#scategory').html();
var category = $('#slength').html();
$.ajax({
            //this is the php file that processes the data
            url: "showitem.php",

            //GET method is used
            type: "GET",

            //pass the data
            data: '&price='+price+'&category'+category+'&length='+length,
            //Do not cache the page
            cache: false,

             beforeSend: function(){
            //do something before data is sent  

            },
             complete: function(html){
             //do soemthing after data has been sent
             },


            //success
            success: function (html) {
            //do something with the result
            },

            error : function ()
            {
            //something went wrong
            }


        });