php - $ .get in jqueryは、javascriptを介してhtmlページで実行されていません

Question

私は自分のサイトの簡単なダウンロードカウンターを次のように作成しようとしています：jqueryを使用してダウンロード時間を示すtxtの値を取得し、jqueryを使用してajaxを呼び出してPHPファイルを実行します。次に、そのようなtxtファイルを上書きして（phpファイルにインクリメントして）保存し、jqueryで値を読み戻します。私が忘れる前に、そして誤報を避けるために、ここにページの全体のHTMLコードがあります：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
  <head>
    <title>GreenDream: SMS Sender</title>
    <link rel=StyleSheet type="text/css" href="http://www.gfcf14greendream.com/CSS/greendream.css" />
    <link rel="SHORTCUT ICON" href="http://www.gfcf14greendream.com/images/dreamicon.ico">  

    <script type="text/javascript" src="http://www.gfcf14greendream.com/JS/greendream.js"></script>
  </head>
<body onload="startTime(); handleTextFile()">
  <div id="background">
    <img src="http://www.gfcf14greendream.com/images/greentwi.png" class="stretch" alt="" />
  </div>

  <br />

  <table align="center">

    <tr>
        <td>
            <a href="http://www.gfcf14greendream.com/"><img src="http://www.gfcf14greendream.com/images/dream.png" align="middle"></a>
        </td>

        <td>
            <div id='pbutton' style="width:113px; height:41px; margin:0px;white-space:nowrap; word-spacing:0;"><a class="button" href="http://www.gfcf14greendream.com/programs.html">Programs</a></div>
        </td>

        <td>
            <div id='gbutton' style="width:93px; height: 41px; margin:0px;white-space:nowrap; word-spacing:0;"><a class="button" href="http://www.gfcf14greendream.com/games.html">Games</a></div>
        </td>

        <td>
            <div id='tbutton' style="width:108px; height: 41px; margin:0px;white-space:nowrap; word-spacing:0;"><a class="button" href="http://www.gfcf14greendream.com/tutorials.html">Tutorials</a></div>
        </td>

        <td>
            <div id='bbutton' style="width:74px; height: 41px; margin:0px;white-space:nowrap; word-spacing:0;"><a class="button" href="http://blog.gfcf14greendream.com/">Blog</a></div>
        </td>

        <td>
            <div id='mbutton' style="width:114px; height: 41px; margin:0px;white-space:nowrap; word-spacing:0;"><a class="button" href="http://www.gfcf14greendream.com/aboutme.html">About Me</a></div>                        
        </td>

        <td style="padding-left:50px">
            <div id='daytitle'></div>
            <div id='clock'></div>
        </td>
    </tr>

  </table>

  <br />

  <div style="text-align: center; color:#00FF00; font-size: 20px">The following is a Visual C++ program that was designed specifically to send text messages to a phone... Free of charge!!</div>
  <br />
  <div style="text-align: center; color:#FFFF00; font-size: 20px">THE GOOD: If you have a prepaid phone, then you can send text messages to a phone without wasting your minutes...</div>
  <br />
  <div style="text-align: center; color:#FF8000; font-size: 20px">THE BAD : Since I haven't been able to put a Skype or Google Voice library for use with C++, this application depends on using what's known as an SMS gateway, different for every phone carrier... meaning you must know your recipient's carrier to be able to send a message!</div>
  <br />
  <div style="text-align: center; color:#FF0000; font-size: 20px">THE UGLY: This program doesn't work on computers connected to safe networks (such as college/university networks) ... at least not yet!</div>
  <br />
  <div style="text-align: center; color:#00FF00; font-size: 20px">You will probably need the Visual C++ Redistributable Package (or the .NET framework or both, but most likely just the package) to run this program, if you don't have it installed on your pc yet</div>
  <br />
  <br />
  <div style="text-align: center; color:#0000C8; font-size: 20px">Click <a href="http://www.microsoft.com/en-us/download/details.aspx?id=5555">here</a> to download the Visual C++ Redistributable Package</div>
  <div style="text-align: center; color:#0000C8; font-size: 20px">Click <a href="http://www.microsoft.com/en-us/download/details.aspx?id=17851">here</a> to download the .NET Framework 4</div>
  <br />
  <br />

  <div style="text-align: center; color:#00FF00; font-size: 20px"><a class="button" id="downbutton" style="width:115px;margin:0px;white-space:nowrap; word-spacing:0;" href="http://www.gfcf14greendream.com/Programs/SMSSender/SMS Sender.exe">Click here to download SMS Sender</a></div>
  <br />
  <div id='counter' style="text-align: center;"></div>

  <br />

  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  <script type="text/javascript">

    function handleTextFile()
    {
        document.getElementById('counter').style.color = "rgb(0, 255, 0)";
        document.getElementById('counter').style.fontWeight = 'bold';

        var downcounter = 0;

        $.get("http://www.gfcf14greendream.com/counters/smssender.txt", function(data){
            downcounter = data;
            if (downcounter == 1)   $("#counter").text("SMS Sender has been downloaded " + downcounter + " time...");   
            else $("#counter").text("SMS Sender has been downloaded " + downcounter + " times..."); 
        });

        $("#downbutton").click( function(){     

            $.get("http://www.gfcf14greendream.com/PHP/smssender.php", function(data){
                $.get("http://www.gfcf14greendream.com/counters/smssender.txt", function(data){
                    downcounter = data;
                    if (downcounter == 1)   $("#counter").text("SMS Sender has been downloaded " + downcounter + " time...");   
                    else $("#counter").text("SMS Sender has been downloaded " + downcounter + " times..."); 
                });             
            });
        });

    }

  </script>

</body>
</html>

ページを実行したら、このコード（上記の一部）を使用してtxtファイルを読み取り、ダウンロード数を取得します（これは機能します）。

var downcounter = 0;

        $.get("http://www.gfcf14greendream.com/counters/smssender.txt", function(data){
            downcounter = data;
            if (downcounter == 1)   $("#counter").text("SMS Sender has been downloaded " + downcounter + " time...");   
            else $("#counter").text("SMS Sender has been downloaded " + downcounter + " times..."); 
        });

次に、下ボタン変数をクリックすると、次のコードが実行されます。

$("#downbutton").click( function(){     

            $.get("http://www.gfcf14greendream.com/PHP/smssender.php", function(data){
                $.get("http://www.gfcf14greendream.com/counters/smssender.txt", function(data){
                    downcounter = data;
                    if (downcounter == 1)   $("#counter").text("SMS Sender has been downloaded " + downcounter + " time...");   
                    else $("#counter").text("SMS Sender has been downloaded " + downcounter + " times..."); 
                });             
            });
        });

、コードが次のphpファイルを読み取る必要があります。

<?php
    $counter = intval(file_get_contents('/homepages/37/d434704165/htdocs/counters/smssender.txt'));
    $counter++; 
    file_put_contents('/homepages/37/d434704165/htdocs/counters/smssender.txt', $counter);
?>

また、phpを実行すると、txtファイル「smssender」が上書きされ、ダウンロード数が増加します。私のサイトでphpファイルのアドレスを手動で入力することが実際に機能し、ダウンロードの増分が行われることに気づきました。ただし、JQueryがコードを実行するとき、増分は行われません。この行にあると思いますが、ここでのエラーは何でしょうか？：

$.get("http://www.gfcf14greendream.com/counters/smssender.txt", function(data){

助けや提案をありがとうございました！

score 1 · Accepted Answer

PHPページを単独で使用する方がはるかに簡単だと思います。GET変数を使用して、ダウンロードカウンターをインクリメントする必要があるかどうかを判断できます。たとえば、PHPファイルで次のようにします。

<?php
$total = (int)file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/counters/smssender.txt');

if (isset($_GET['i'])) {
    $total++; 
    // now update the file for future use
    file_put_contents($_SERVER['DOCUMENT_ROOT'] . '/counters/smssender.txt', $total);
}

echo $total;
?>

次に、ajaxでPHPページを単独で呼び出すことができるため、両方の呼び出しが同時に実行されてエラーが発生することを心配する必要はありません。現在のダウンロード数を取得したいときに、「smssender.php」を呼び出すだけで済みます。さらに、現在のダウンロード数を取得してファイルの内容をインクリメントする場合は、「smssender.php？i」を呼び出すことができます。

ファイルの内容のみをインクリメントし、出力をエコーしたくない場合は、別のifステートメントを追加できますが、それがあなたがやろうとしていることかどうかはわかりません。もしそうなら、私に知らせてください、そして私はあなたにそのためのコードも示すことができます。そうでない場合は、私に知らせてください。

更新：コードを次のように変更するだけです：

Javascriptファイル：

$.get("/PHP/smssender.php", function(data) {
    $("#counter").text(data);            
});

$("#downbutton").click( function() {     
    $.get("/PHP/smssender.php?i", function(data) {
        $("#counter").text(data);            
    });
});

PHPファイル：

<?php
$total = (int)file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/counters/smssender.txt');

if (isset($_GET['i'])) {
    $total++; 
    // now update the file for future use
    file_put_contents($_SERVER['DOCUMENT_ROOT'] . '/counters/smssender.txt', $total);
}

$suffix = ($total == 1) ? 'time' : 'times';

echo 'SMS Sender has been downloaded ' . $total . ' ' . $suffix . '...';
?>

これで、Javascript/jQueryをALOTで簡略化できます。このコードは、エラーが発生することなく、コードとまったく同じ動作をします。次に、私が行った変更について説明します。まず、現在のダウンロード数を取得するだけなのか、合計を増やすのかに関わらず、$。get（）メソッドを使用して単一のPHPファイルを呼び出すだけで済みます。

次に、テキスト処理はPHPファイルで行われます。Javascriptで1回以上ダウンロードされたかどうかを判断する必要はなくなりました。代わりに、データを取得して後で計算するよりもはるかに高速であるため、PHPファイルがこれを処理します。

最後に、ダウンロードボタンで$ .get（）を1回だけ呼び出すようにしたので、2つの異なるページを同時に取得しようとしたことによるエラーについて心配する必要はありません。あなたのコードを私が上に投稿した新しいコードに置き換えてみて、それがあなたのためにどのように機能するかを私に知らせてください。

php - $ .get in jqueryは、javascriptを介してhtmlページで実行されていません

1 に答える 1

Related

Reference