Question

大家好我对编程很新。我一直在教自己php和css，并试图将它与一些jQuery结合起来。

我有一个网站，其中包含我希望允许用户投票的项目列表。（www.blueskycouncil.com您可以使用stack / this登录）

目前我通过发送以下内容来更新数据库：

<a href=\"idea_karma.php?pagetype=index&karmatype=ideaspace&id={$row['id']}&sort_id=$sort_id\">

到idea_karma.php，检查用户是否已经投票，如果没有更新数据库。

这很好（除了noob代码）

现在我想用jQuery代替它，这样我只更新点而不是整个页面。

两个变量是动态的（id和sort_id），特定的值是在循环中分配的。

我的问题是如何处理这个问题？

我尝试过几件事，但我似乎无法让他们工作。

这是sript

<script type="text/javascript"> 
function get() { 
$.get('idea_karma.php', {"pagetype": index, "karmatype": ideaspace, "id": id, "sort_id":   sortid},

function (output) {
    $('#karma').html(output).show();
    }};

}

这是我调用脚本的地方

<div class=\"karma-btn\">
<a href=\"idea_karma.php?pagetype=index&karmatype=ideaspace&id= {$row['id']}&sort_id=$sort_id\" onClick=\"get();\">
<img src=\"images/btn_lrg_karma.png\" alt=\"Alternative text\">
<span class=\"voted\"><div id="karma">{$row['karma']</div>}</span></a>                                                      </div>

Answer 1

您需要做的是更改该链接，以便在单击时使用适当的参数调用javascript函数。 javascript函数将执行AJAX，看起来像这样：

function updateKarma(id, sortId){
  $.post("idea_karma.php", 
  {pagetype: "index", karmatype: "ideaspace", id: id, sort_id: sortId}, 
  function(){
    //in here you can do you stuff when the call returns
    alert("karma updated");
  });
}

然后，您的链接代码如下所示：

<a href=\"javascript:void(0);\" onclick=\"updateKarma('{$row['id']}', '$sort_id')\">

我认为这就是你所追求的目标？

Answer 2

您可以为锚点分配onclick功能，如下所示 -

<a href="#nodo" onclick="update_vote('<?=$row['id']?>','<?=$sort_id?>')">vote</a>

然后你可以在你的js文件中编写一个函数 -

function update_vote(id,sort_id){


//Now you can call the url you were calling through the of the jquery.

// You can update spection section in page in the `sucess` callback function of ajax.

}

ajax的详细文档可在 - http://api.jquery.com/jQuery.ajax/

获得

Answer 3

以下是让您使用ajax的基本想法：

function doKarma(id, sort_id) {
    var keyValue = {
        'method' : 'doKarma',
        'pageType' : 'index',
        'karmaType' : 'ideaspace',
        'id' : id,
        'sort_id' : sort_id
    };    
    $.post('/idea_karma.php', keyValue, function(xml) {
        var stat = $(xml).find('rsp').attr('stat');
        // stat will represent whether your api call failed or was a success
        if (stat === 'ok') {
            // update your counter
            alert('success');
        }
        else {
            // user has already voted or something went wrong
            alert('failed');
        }
    },'xml');
}

这是您的idea_karma.php页面

的一个示例

<?php

if ($_POST['method'] == 'doKarma') {
    //perform update of karma

    header("Content-type: text/xml");
    // if success
    echo '<rsp stat=\"ok\"></rsp>';
    // else echo '<rsp stat=\"error\"></rsp>';
}

?>

Answer 4

查看Ajax，Get，Post的jQuery API。如果您需要对已编写的代码提供特定帮助，我建议您发布它，我们可以帮助您排除故障。

使用jQuery / PHP / mySQL更新数据库并显示新结果

4 个答案: