のくす牧場
コンテンツ
牧場内検索
カウンタ
総計:127,063,069人
頁
昨日:no data人
頁
今日:人
頁
最近の注目
人気の最安値情報

    元スレ+ JavaScript の質問用スレッド vol.113 +

    JavaScript覧 / PC版 /
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。
    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで
    851 = :

    関数内で得たローカル変数をグローバル変数として利用する方法はありますか？

    またapiの処理が重いため、func1の処理が完全完了→func2を実行、func2の処理が完全完了→最終的な処理を実行、というようにしたいです。
    具体的なソースを書くと長くなってしまうため、簡略化したものを記載いたします。

    現状ですと、最終的なalertで、「NaN」という値が表示されてしまいます。
    私が求めているのは「aaabbb」という値が表示されることなのですが、どうもうまくいきません。

    勉強不足は重々承知しておりますが、何卒宜しくお願いいたします。

    //////////////////////////////////////////////
    window.onload = function(){
    //aaa、bbbをグローバル変数として定義している（つもり…。）
    var hoge1,hoge2;

    function func1() {
    //aaaは仮です。実際にはfunc1の中でapiを叩いて返って来たきた値が入ります。
    hoge1 = "aaa";
    }

    function func2() {
    //bbbは仮です。実際にはfunc2の中でapi(↑のaaaとは別のapi)を叩いて返って来たきた値が入ります。
    hoge2 = "bbb";
    }

    //別々のapiからとって来たaaa bbbという値で最終的な処理を行いたいと思っています。
    alert(hoge1 + hoge2);
    }
    //////////////////////////////////////////////

    852 = :

    ローカル変数グローバル変数云々というより関数の実行順序の問題っぽい
    現状ではhoge1とhoge2の少なくとも一方の値が取得できていない時点で
    alertを実行しているからNaNの出力になっていると思う
    どのapiを使っているか知らないけどデータの取得を知らせるイベントがあるはず
    同期処理、非同期処理、コールバック、イベントリスナー
    ここらへんの用語で検索かけて勉強するしかないよ

    853 = :

    http://developers.google.com/maps/documentation/javascript/tutorial?hl=ja#Loading_the_Maps_API
    例えばこのページの「APIの非同期読み込み」の項目にあるような事をしないといけない

    854 = :

    >>851
    2014/3/5 02:17:52 に全く同じ質問が知恵袋で質問されていますね。
    回答が一つついているので参考にしてみては？
    http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q10121979265

    855 = :

    >>852
    >>853
    ありがとうございます。
    参考にさせていただきます。

    >>854
    急ぎのものだったので知恵袋にも並行して投稿させていただきました。

    856 = :

    >>855
    マルチポストは禁止されていないけど、マルチポスト先を書いておくのが礼儀だよ
    マルチポスト先と同じ回答が寄せられたら、回答者が無駄に時間を使うことになるでしょ？

    857 = :

    >>856
    そうですよね…。
    失礼しました> <

    858 = :

    >>849
    試してないけど、これでもっと短くならないかな？

    $(function(){
    　$('div a').replaceWith(function(){
    　　return $(this).text();
    　});
    });

    859 = :

    >>858
    短くする以前にa要素に子要素がある時点で期待通りに動作しない不具合を何とかするべきのような

    860 = :

    ノード置換の間は普通リフローは発生しませんか？
    ノードを削除したり挿入するたびにリフローが発生すると、
    文字が前後して表示が乱れると思いますが

    861 = :

    replaceChildっていうのがありました
    これを使えばさすがにリフローが発生しないと思われます

    862 = :

    contenteditableでenter入力時に生成されるタグがブラウザごとに違うので
    keypressを検知して、<br><br>を生成するようにしました
    するとスクロールバーが表示される状態の時にはスクロールが追随せず、
    キャレットがスクロール領域からはみ出てしまいます
    キャレットにスクロールを追随させるにはどうしたらいいでしょうか？

    863 = :

    >>860
    > ノードを削除したり挿入するたびにリフローが発生すると、
    > 文字が前後して表示が乱れると思いますが

    リフローと表示が乱れるかどうかは関係ない。

    > replaceChildっていうのがありました
    > これを使えばさすがにリフローが発生しないと思われます

    発生する。

    864 = :

    リフローは再描画ではなくてdomツリーの再読み込みでしたね
    だからdomツリーを変更したら発生するのが当たり前なんですね
    ありがとうございました

    867 = :

    >>862の件ですが、
    selectionのfocusNodeの要素の座標でキャレットの下限が分かるので
    それを使ってスクロールすることができるのでは？と考えたのですが、
    focusNodeでgetBoundingClienrtRect()をしてみても、
    contenteditableな親要素の座標系とは何か違うようです
    contenteditableな要素の座標系にあわせた要素の座標を取るにはどうしたらいいのでしょう？

    868 = :

    ある関数がどこで定義されているかを
    簡単に調べる方法はありますか？
    ブラウザはfirefoxを使っています

    870 = :

    WEBカメラから取得した静止画をcanvasを使って連続表示したら、
    どうもメモリーリークしてるっぽいけど原因が分かりません。
    どこが原因でメモリーリークしてるかアドバイスお願いします。
    <html>
    <head>
    <script type="text/javascript" src="excanvas.compiled.js"></script>
    <script type="text/javascript">
    <!--
    function getWebCamImage()
    {
    var canv = document.getElementById('WebCamImage');
    if (!canv || !canv.getContext) {
    return false;
    }
    var cont = canv.getContext('2d');
    var img = new Image();
    img.src = "http://xxx.xxx.xxx.xxx:80/hoge.cgi&" + new Date().getTime();
    img.onload = function() {
    cont.drawImage(img, 0, 0, 320, 240, 0, 0, 640, 480);
    canv = null;
    cont = null;
    img = null;
    setTimeout("getWebCamImage()", 50);
    }
    }
    //-->
    </script>
    </head>
    <body onload="getWebCamImage();">
    <canvas id="WebCamImage" width='640' height='480'></canvas>
    </body>
    </html>

    874 = :

    質問者がメモリリークしてるっぽいと考えた理由を聞きたい
    50ミリ秒の間隔でこの操作で静止画像を取り出そうとするのに疑問を感じる
    動画でいいと思うんだが

    875 = :

    >>871
    ネットで見つけたサンプルを真似た感じなんですが、ご指摘のように
    毎回実行しなくてもグローバル変数に変更してnullで初期化しておけば
    nullの時だけcont = canv.getContext('2d')すればよさそうですね。

    >>872
    なるほど、この方法では開放されないとなると・・・もうちょっと開放
    方法について調べてみます。

    >>873
    C言語の再帰呼び出しのように自分で自分を直接呼び出すとご指摘の
    ように戻り番地がスタックに積まれていくのは理解しています。
    setTimeoutで自分自身を遅延呼び出しする場合も同様の現象になる
    のであれば、ご指摘のとおりだと思いますので別の呼び出し方法を
    調べてみます。

    >>874
    ChromeのタスクマネージャとデベロッパーツールのTimelineでメモリの
    状況を観測すると消費メモリがどんどん増えていたのでメモリリークだと
    判断しました。
    静止画を取り出してる理由は、WEBカメラがMJPEGで画像を取得するタイプ
    だったのと、取得画像を後処理で加工したいのでcanvasを使ってます。

    877 = :

    >>875
    クロージャを使わないコードに修正すればいいかと

    878 = :

    >>875
    50msって結構な頻度だよ
    http通信はやめたほうがいいと思う

    879 = :

    この画像のようにある程度いってもまた下がるのなら
    気にしなくていいのでは

    880 = :

    createTextNodeの引数がDomStringで、DomStringはUTF-16文字列らしいですが
    UTF8のソースでcreateTextNode("ほげ")としても、正しく動作します
    何故でしょうか？

    882 = :

    ありがとうございました

    883 = :

    昭和という単語だけを青文字にしたりしたいと考えています。

    下記の様に特定のidやclassの文字色を変えるというのはよく見かけるのですが
    document.getElementById("sample").style.color = "blue";
    指定した単語の文字色を変更するのはどのようにすればよいのでしょうか？

    884 = :

    >>883
    指定した文字をreplaceで置き換える。
    「うんこ」をタグなりで色を変えればいいのだ。

    885 = :

    >>883
    平文の中の特定のパターンに一致する単語にスタイルを適用する方法は
    ごく一部（ :first-letter など）を除いて存在しない

    仮にそのような機能があったとしても、文字列 AB と BC と CA
    に違う色を付けるとき ABC や ABCABC はどう扱うのかとか、
    非常にややこしいことになる

    したがって、その単語を平文から抽出して、独立の要素ノードに置換する
    処理を書く必要がある

    具体的には Traversal などを使って各テキストノードを順次走査して
    その中のテキストを正規表現でテストして
    該当する単語の部分を新たな要素ノードに置換
    等々

    886 = :

    jqueryなら簡単にできるんじゃね

    887 = :

    そう、jQueryならね

    888 = :

    >>862の件ですが、
    brの後ろに計測用の<span>　</span>を入れて、
    その要素のoffset座標やheightを取得し、
    その後すぐに削除する、という方法で、キャレットのbottom座標を得ることに成功しましたが
    一瞬とはいえ空白を挿入するので、
    文字列の途中に改行を挿入する場合には文字がズレるのが気持ち悪いです
    （一瞬なので目には見えませんが）
    もっとスマートな方法はないでしょうか？

    889 = :

    fontタグ入りのコードに置き換えたらいいだけだろ。

    890 = :

    IEでテーブルの現在選択しているTD要素のDOMを取得したいんだけど、何かいい方法ないですか？
    jQueryは使わない方向で。
    TableのってのがやっかいみたいでIEだとテキスト情報しかとってこれねぇ

    891 = :

    tableの中にはtbodyがあるとかそういうのをすっとばしてたりしない？
    うまく行かない最小限のサンプルを貼ってみれば。

    892 = :

    >>886-887
    横からですが、jQueryはテキストノード操作に不向きと認識していました。
    具体的にはどのようなコードになるでしょうか。
    jQueryは内部的にはinnerHTMLやtextContentを利用した実装でテキストノード操作ならむしろ標準APIが書きやすい認識だったのでどんなコードになるのかちょっと気になります…。

    893 = :

    jQueryはテキストノード操作に不向きっていうか
    テキスト”ノード”ではなく、
    テキストノードに含まれるテキスト（ただの文字列）の
    話だからね。

    jQueryはDOM操作ライブラリであって
    テキスト編集ライブラリではないので、
    不向きというより、目的が違うと言うべき。

    894 = :

    >>889
    fontを小さくするということですか？
    たしかにズレを小さくすることはできますがキャレットのボトム位置が変わってしまいそうです
    でもありがとうございました

    895 = :

    >>893
    仰るとおりだと思います。
    だからこそ、jQueryで簡単に出来る理由がわかりません…。

    896 = :

    >>895
    >>883のプログラムを>>895が標準APIで書いてみたら？
    >>886->>887がそれに対抗してjqueryで"簡単"に書いてくれるかも
    それらを見比べたら簡単に出来ているのか簡単に出来ていないのか
    そしてその理由も分かるかもしれない

    897 = :

    jqueryなら簡単にできそうって思っただけで、本当にできるかは分からない
    混乱させてごめん

    898 = :

    >>896
    書きました。
    http://jsfiddle.net/3F4Wa/

    >>897
    私がここを見て書くまでの間は>>896までしかいなかったんですが、結局、こんな落ちだったとは…。

    899 = :

    >>891
    IE7も考慮すると選択範囲とってこれるのはselection.createRangeぐらい？
    なのでそれを使用
    var range = document.selection.createRange();
    rangeには選択したテキストが入る。ここでTDが入ってくれるといいんだけどそうもいかない。
    var elem = range.parentElement();
    なのでそのテキストの親を見る。その際にTD一つだけ選択されている場合はTDをとってこれる。
    ただ、複数のTDを選択している場合、elemにはTRが入る。そのせいでどのTDが選択されている
    のかが絞れない。
    そんな状況です。

    900 = :

    http://jsbin.com/xegufedi/1/edit

    divの直下にspanを配置します
    そしてspanのoffset座標を表示すると、(8, 8)になります
    しかし見た目8ピクセルも開いているように見えませんし、
    親divのmargin、paddingも0にしています
    なぜこうなるのでしょうか？


    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで / JavaScript一覧へ
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。

    類似してるかもしれないスレッド

    トップメニューへ / →のくす牧場書庫について