0

JavaScript の株式ティッカーを機能させようとしていますが、順調に進んでいますが、私の JavaScript の知識は初心者レベルです。

現在のコード (上の例) は、Google Finance API を使用してライブ株式データを引き出します。株式の頭字語を確認し、完全な会社名を出力し、さまざまなスタイルを設定します。

2番目の部分は、表形式で表示されるデータを取得しようとする試みです。列は機能しますが、jqueryで最終列にライブ日付を入力することはできません:(。

3 つの列を作成する必要があります。1 つは株名 (例: HAULOTTE)、1 つは株の頭字語 (例: (PIG)、もう 1 つは家畜の数字です。これにより、各在庫データ行がその上下の行と平行に保たれます。

添付されているのは現在の jsfiddle です。

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

https://jsfiddle.net/oqousaLw/

<div class="haul" data-symbol="PIG" data-title="HAULOTTE"></div>
<div class="ashtead" data-symbol="AHT" data-title="ASHTEAD"></div>
<div class="united" data-symbol="URI" data-title="UNITED RENTALS"></div>
<div class="terex" data-symbol="TEX" data-title="TEREX"></div>
<div class="cat" data-symbol="CAT" data-title="CATERPILLER"></div>
<div class="hees" data-symbol="HEES" data-title="H&E EQUIPMENT"></div>
<div class="pal" data-symbol="PAL" data-title="PALFINGER "></div>
<br>
    <br>
        <b>Replicate above code but in table format. cant get live data to appear</b>
        <br>
            <br>

        <div class="box">
<div class="floatleft2 " style="padding:5px;">
    <div>HAULOTTE</div>
    <div>ASHTEAD</div>
    <div>UNITED RENTALS</div>
    <div>TEREX</div>
</div>
<div class="stockSymbolnew" style="padding:5px;">
      <div><b>PIG</b></div>
      <div><b>AHT</b></div>
      <div><b>URI</b></div>
      <div><b>TEX</b></div>
</div>
<div class="floatleft2" style="padding:5px;">
    <div><i>GET live data</i></div>
      <div><i>GET live data</i></div>
      <div><i>GET live data</i></div>
      <div><i>GET live data</i></div>
</div>
</div>
4

1 に答える 1

0

jsfiddleを更新して、期待どおりに動作するようにしました。

私がしたことは、以下の div に値を動的に入力することだけです。

値を追加できるように、div に ID を提供しました。

<div id="title" class="floatleft2 " style="padding:5px;">

</div>
<div id="symbols" class="stockSymbolnew" style="padding:5px;">

</div>
<div id="liveData" class="floatleft2" style="padding:5px;">

</div>

以下のようにjqueryを使用して追加された値。

$("#title").append("<div>" + divContainer.data('title') + "</div>");
$("#symbols").append("<div><b>" + stockInfo1.t + "</b></div>");
$("#liveData").append("<div>" + stockChange + "</div>");

注: Google Finance への get 呼び出しは非同期であるため、アイテムの順序はリクエストごとに異なります。

アップデート

あなたのコメントに基づいて回答を更新しました。

ここで更新された jsfiddle を見つけてください。レコードの順序を固定するには、要素を配置し、要素に値を設定するための識別子を用意する必要があります。これを行うには、以下のようにライブ データを表示する div に ID を提供します。

<div class="floatleft2" style="padding:5px;">
      <div><i id="liveDataPIG"></i></div>
      <div><i id="liveDataAHT"></i></div>
      <div><i id="liveDataURI"></i></div>
      <div><i id="liveDataTEX"></i></div>
      <div><i id="liveDataCAT"></i></div>
      <div><i id="liveDataHEES"></i></div>
      <div><i id="liveDataPAL"></i></div>
</div>

js を更新して、このような値を提供します。

$("#liveData" + stockInfo1.t).html(stockPrice + stockChange);

jquery セレクターの仕組みに精通している場合は、理解するのは非常に簡単です。

そうでない場合は、 https://api.jquery.com/category/selectors/basic-css-selectors/を参照してください。これにより、基本的な考え方が得られます。他のセレクターはhttps://api.jquery.com/category/selectors/にあります。

于 2015-06-01T10:58:37.913 に答える