2

OK、ここで私がやろうとしているのは、ユーザーがキャッシュをクリアしたりページを更新したりすることなく、リアルタイムでダウンロードをカウントし、値をリアルタイムで出力するダウンロードカウンターが必要なことです。これで、MySQLとPHPを組み合わせたJavaScript(これはリアルタイムで更新するために使用されています)を少し使用してこれを実現できます。しかし、問題は、リアルタイムで値を出力するために、ユーザーがこの「ボタン」をクリックしたときに、スパンタグを作成し、ボタンを含むアンカータグ内に含める必要があることです。 /link追跡しています。

あなたがよりよく理解するのを助けるために、ここに私のHTMLとJavaScriptがあります。

<?php 

    foreach($files_array as $key=>$val)
    {
        echo '<a class="btn btn-primary btn-large" href="download.php?file='.urlencode($val).'"><span class="download-text">Download 
                </span></a><span class="download-count" title="Times Downloaded">'.(int)$file_downloads[$val].'</span>
                ';
    }

?>

そしてここにJavaScriptがあります

$(document).ready(function(){
/* This code is executed after the DOM has been completely loaded */

$('#download-button a').click(function(){

    var countSpan = $('.download-count',this);
    countSpan.text( parseInt(countSpan.text())+1);
}); });

タグの内側ではなく外側に、カウンターのスパンタグを含めないようにしたい。

前もって感謝します :)

4

2 に答える 2

2

コメントで提案したのは次のようなものです。

<ul>
<?php 
    foreach($files_array as $key=>$val) {
        echo '<li>';
        echo '<a class="btn btn-primary btn-large" href="download.php?file='.urlencode($val).'"><span class="download-text">Download</span></a><span class="download-count" title="Times Downloaded">'.(int)$file_downloads[$val].'</span>';
        echo '</li>';
    }
?>
</ul>

次にJavaScriptで:

$(document).ready(function(){
    /* This code is executed after the DOM has been completely loaded */

    $('#download-button a').click(function(){
        var countSpan = $(this).closest('li').find('.download-count');
        countSpan.text( parseInt(countSpan.text(), 10) + 1);
    }); 
});
于 2013-03-25T01:30:44.987 に答える
1

アイテムをダウンロードしたグローバルユーザーの数をポーリングし、ページを更新せずにフロントエンドを更新できるようにする場合は、ソケットまたはsetInterval()を使用する必要があります。

setInterval()を使用して、3秒ごとに数値を更新する方法は次のとおりです(あまりやりたくない場合は、サーバーに大きな負荷がかかります)。

<ul>
<?php 
    foreach($files_array as $key => $val) {
        echo "<li id=\"download-$key\">";
        echo '<a class="btn btn-primary btn-large" href="download.php?file=' . urlencode($val) . '"><span class="download-text">Download</span></a><span class="download-count" title="Times Downloaded">' . (int)$file_downloads[$val] . '</span>';
        echo '</li>';
    }
?>
</ul>

<script>
    setInterval(function() {
        $.getJSON('/download-count.php', function(e) {
            var i;
            for (i in e) {
                if (e.hasOwnProperty(i)) {
                    $('#download-' + i + ' .download-count').text(e[i]);
                }
            }
        });
    }, 3000); // ping every 3 seconds
</script>

/download-count.phpあなたの番号のJSONをエコーアウトするAjax用の新しいファイル(私の例では私はそれを呼んだ)が必要になります

echo json_encode($file_downloads);

これは明らかに単純な例ですが、うまくいけば、それが意味を理解するでしょう。

更新:download-count.phpファイルは次のようになる必要があります。

<?php
    /**
     * You don't show how you populate $file_downloads in your question but
     * however you do it, do it the same way here
     */
    $file_downloads = foo();

    echo json_encode($file_downloads);

    die();
于 2013-03-25T01:52:07.113 に答える