11

毎回動作するように、以下のスクリプトを修正するにはどうすればよいですか？動作する場合と動作しない場合があります。Pro JQueryはこれの原因を説明していますが、修正方法については説明していません。私はそれがajax準備完了状態に関係していることをほぼ確信していますが、それをどのように書くかについての手がかりはありません。Webには、ajaxとJQueryを作成するための約99の異なる方法が示されていますが、これは少し圧倒的です。

私の目標は、サーバーベースのテキストファイルからのテキストで埋めることができるHTMLシェルを作成することです。例：AGという名前のサーバーにテキストファイルがあり、その内容がPF：PF-01、PF-02、PF-03などであるとします。この情報を取得して、HTMLDOMにデータを入力します。ユーザーに表示されます。AはPHPで@＃！＃$ *＆ゴールデンでしたが、私のホストがfopen（）をシャットオフしていることがわかりました。だからここにいます。

助けてくれてありがとう。

JS-plantSeed.js

var pageExecute = {

fileContents:"Null",
pagePrefix:"Null",
slides:"Null",

init:function () {
    $.ajax({
      url: "./seeds/Ag.txt",
      success: function (data){
            pageExecute.fileContents = data;
      }
});
}
};

HTML-HEAD

<script type="text/javascript">
    pageExecute.init();
</script>

HTML-BODY

<script type="text/javascript"> alert(pageExecute.fileContents); </script>
4

4 に答える 4

13

これを試して：

var pageExecute = {

    fileContents:"Null",
    pagePrefix:"Null",
    slides:"Null",

    init: function () {
        $.ajax({
            url: "./seeds/Ag.txt",
            async: false,
            success: function (data){
                pageExecute.fileContents = data;
            }
        });
    }
};
于 2012-07-21T04:30:01.047 に答える
12

これを試して：

HTML：

<div id="target"></div>

JavaScript：

$(function(){
    $( "#target" ).load( "pathToYourFile" );
});

私の例では、divはファイルの内容で埋められます。jQuery.load()関数を見てください。

「pathToYourFile」は、ロードするデータを含む任意のリソースにすることができます。使用方法の詳細については、ロードメソッドのドキュメントを参照してください。

編集：操作する値を取得するための他の例

$.get()関数の使用：

$(function(){
    $.get( "pathToYourFile", function( data ) {
        var resourceContent = data; // can be a global variable too...
        // process the content...
    });
});

$.ajax()関数の使用：

$(function(){
    $.ajax({
        url: "pathToYourFile",
        async: false,   // asynchronous request? (synchronous requests are discouraged...)
        cache: false,   // with this, you can force the browser to not make cache of the retrieved data
        dataType: "text",  // jQuery will infer this, but you can set explicitly
        success: function( data, textStatus, jqXHR ) {
            var resourceContent = data; // can be a global variable too...
            // process the content...
        }
    });
});

次の点に注意することが重要です。

$(function(){
    // code...
});

と同じです：

$(document).ready(function(){
    // code
});

また、DOMでJavaScriptコードを実行する準備ができている必要があるため、通常はこの構文を使用する必要があります。

于 2012-07-21T04:16:54.733 に答える
3

問題は次のとおりです。本文にスクリプト タグがあり、AJAX データを要求しています。データを吐き出すだけでなく、シェルにデータを書き込むように要求していたとしても... ...それがあなたの一番の問題です。

理由は次のとおりです。

AJAX は非同期です。さて、私たちはすでにそれを知っていますが、それはどういう意味ですか?

これは、サーバーにアクセスしてファイルを要求することを意味します。サーバーは探しに行き、それを送り返します。次に、コンピューターはコンテンツをダウンロードします。コンテンツが 100% ダウンロードされると、使用できるようになります。

...ことは...

あなたのプログラムはそれが起こるのを待っていません。サーバーに時間をかけるように指示し、その間、サーバーからの呼び出しを受けるまで、現在行っていることを実行し続け、コンテンツについて再度考えることはありません。

HTML のレンダリングに関して言えば、ブラウザーは非常に高速です。サーバーは、静的 (プレーンテキスト/img/css/js) ファイルの提供も非常に高速です。

だから今、あなたはレースに参加しています。どちらが最初に起こりますか？サーバーはテキストでコールバックしますか、それともブラウザはファイルの内容を要求するスクリプト タグをヒットしますか?

そのリフレッシュでどちらが勝つかは、起こるものです。

それで、どうやってそれを回避しますか？コールバック。

コールバックは別の考え方です。JavaScript では、ダウンロードが完了したときに使用する関数を AJAX 呼び出しに与えることで、コールバックを実行します。

それは、職場から誰かに電話して、「この内線をダイヤルして、私に連絡が取れたら、私に連絡してください」と言っているようなものです。

jQuery では、AJAX 呼び出しで「success」というパラメーターを使用します。AJAXsuccess : function (data) { doSomething(data); }呼び出しに渡すオブジェクトの一部を作成します。ファイルがダウンロードされるとすぐに、jQuery はその結果を、指定された成功関数に渡します。この関数は、実行するように指定されたすべてのことを実行するか、呼び出すように作成された関数を呼び出します。

試してみる。どのダウンロードが最初に行われたかを競うよりも確実です。

于 2012-07-21T04:33:41.550 に答える
1

url: "./seeds/Ag.txt",を使用してファイルを直接ターゲットにしないことをお勧めします。代わりに、 PHPのようなサーバー側スクリプトを使用してファイルを開き、プレーン形式または JSON 形式でデータを返します。

ここでファイルを開くためのチュートリアルを見つけることができます: http://www.tizag.com/phpT/fileread.php

于 2012-07-21T04:18:28.067 に答える