タグ

関連タグで絞り込む (219)

タグの絞り込みを解除

JavaScriptに関するiwwのブックマーク (896)

  • JavaScriptのコード整形ツール

    公開日: 2015/08/28 | 更新日: 2017/05/29 Minify処理などで難読化したJavaScriptのコードに、インデントや改行を付けて、分析したり確認しやすく整形するツールです。 変換「変換前」のフォームに、コードを入力するか、ファイルをドロップして下さい。「変換後」のフォームに変換結果が表示されます。

    JavaScriptのコード整形ツール
    iww
    iww 2017/02/26
  • IE9+対応でjQueryのajaxを使って非同期的にファイルをアップロードする | ITハット

    IE9以下でも画面遷移なしにファイルをアップロードする必要があり、少しつまづいたので紹介したいと思います。古くからある手法のようです。 ajaxでアップロード HTML ファイルをアップロードする わかりやすいように必要最低限のHTMLです。<button> の type 属性は はJS側で送信するので、buttonとしておきます。 PHP // 一時ファイルパス $tmp = $_FILES['file']['tmp_name']; // アップロードするフォルダのパス $save = 'test/'.$_FILES['file']['name']; // アップロードに成功したとき if (@move_uploaded_file($tmp, $save)) { echo json_encode(array('state' => true, 'name' => $_FILES['file

    IE9+対応でjQueryのajaxを使って非同期的にファイルをアップロードする | ITハット
  • ファイルアップロードをajaxで行う IE対応 - AUSGANG SOFT

    ファイル選択をしたら自動的にajaxでアップロードする機能をつくっていたのだけど、やっぱりIE対応でつまづいた。いちおうIE8対応を目指した。 ajax送信は、このライブラリを使用。 jQuery Form Plugin http://malsup.com/jquery/form/ そのままだとIEで動かない。 596行目のfinallyがIEではエラーになるので、コメントアウト。 次、ファイル選択で自動アップロードしたかったので、jQueryのchangeイベントで処理を書いたが発火してくれない。 jQueryのchangeイベントで気をつけること http://d.hatena.ne.jp/sho-yamasaki/20120319/1332168988 onchangeならうまくいくらしい。 あと、ファイル選択部分を以下をつかって整えた。 JavaScript · Jasny Boo

  • [JavaScript] FormDataの使えないIE8やIE9での代替策 : してログ - LANDHERE

    FormData があると Ajax でファイルアップロードできるようになって大変便利なのですが、困るのが IE8 と IE9 の対応です。 IE10 からは FormData が使えますが、未だに IE8 の要求は来ます。 かつての IE6 のポジションを受け継いでいる臭が漂っています。 諦めて POST で画面リロードするところでしたが、ちゃんと調べて見ると代替策がありました。 使うのは POST ですが、見せ方としては非同期通信っぽく動きます。 サンプルコードは載せませんが、要点を箇条書きにしますので、参考にしてください。 親ページに iframe を配置して見えないようにします(display:none だと Safari でまずいみたいなので、横幅&縦幅をゼロにします) フォームのターゲット要素(target="<iframe名>")で、配置した iframe を指定します サー

    iww
    iww 2017/02/10
    iframeを使う方法 ヒントのみ
  • ときどきWEB | HTML5のFile APIでローカルファイル情報取得してやんよ!!!

    そろそろHTML5 APIのひとつでもリファレンスしていこうかな・・・ かといって今さらcanvasとかやってもしょうがないし、MathMLみたいなマニアックなものは覚えても使う機会があるかどうか・・・という事で 『File API』というヤツを手始めに覚えようかと思います。 『File API』について HTML5以前はブラウザ(またはWebアプリ)からローカルファイルを扱うには<input type="file">タグを利用してユーザーがファイルをアップロードする必要がありましたが、 File APIの登場でJavaScriptからローカルファイルを直接読み取ることができる様になりました。 このAPIはユーザーが指定したローカルファイル(Webブラウザが動作するパソコンのHDDやSSDといったストレージに置かれたファイル)の情報やデータを取得できます。 主なAPIの種類 File AP

    ときどきWEB | HTML5のFile APIでローカルファイル情報取得してやんよ!!!
  • はんけい(地図を使って半径を調べるサイト)

    2022/03/09:SSL証明書の切り替えのため2022/03/24から1日~数日httpsでの接続ができない可能性があります。 2020/03/12:マップをGoogleから国土地理院のものに変更しました。 2020/03/12:住所検索機能は停止しました。(運営費用が高くなったことが理由です。) 2017/03/06:スマホ対応したページも作りました。こちら

    iww
    iww 2017/02/03
    地図に円を描く系の中では一番使いやすい
  • ブラウザーのキャッシュ無効化 | [Bad Tongue Q]

    Webサイトの更新作業で、更新ファイルをアップロード後によくクライアントから「更新されてませんよ!」「中身が前のままです・・」と言われること、コレ当に多いんです。Internet Explorer(以下IE)6、7が主流だった頃からちょいちょい言われることはありましたが、大抵、「画面上部ツールバーの【表示】をクリックして【最新の情報に更新】をクリックしてみてください!」とか「F5キーを押してみてください!」で大丈夫やったのが、IE8あたりが普及し始めた頃から頻繁にいろんなクライアントの担当者様から言われるようになったんです。 どうもブラウザー(特にIE)のキャッシュ機能が強力に働いて、同じ名前のファイル(特に画像やPDFです)とかやと更新ファイルをサーバーにアップロードした後にリロードしても画面表示が変わらへん!という、更新作業をする者にしてみれば何とも理不尽な現象が起こってたようでした

    ブラウザーのキャッシュ無効化 | [Bad Tongue Q]
    iww
    iww 2017/02/03
    ちょっとやりたくない方法
  • Code Babies

    It's never too early to develop! Books and shirts for young developers in training.

  • JavaScript Possible Iteration Over Unexpected - Stack Overflow

    I have the following code: for (i in awards) { if (awards[i] instanceof Array === false) { console.log(awards[i]); httpFactory.patch(awards[i], {"read": true}, false); } } My IDE shows this error relating to the code above: Possible iteration over unexpected (custom / inherited) members, probably missing hasOwnProperty check Checks for any instances of unfiltered for-in loops in JavaScript. The us

    JavaScript Possible Iteration Over Unexpected - Stack Overflow
    iww
    iww 2017/01/13
    hasOwnProperty()で確認してから使えと。 こんな面倒なことしてられっか
  • PhpStormで他の言語を埋め込む - Qiita

    PhpStormには、PHPのコード中の一部をPHP以外の言語として扱えるLanguage Injectionという機能があります。 文字列の中にHTMLSQLを書いたときに自然とハイライトされるアレです。 ちなみにSQLPhpStormDBの接続設定を行うとテーブルやカラム名の補完やチェックも行ってくれます。すごい。(実際の設定は割愛します) 通常の文字列中で、自動的に言語の判別をしてくれるのはHTMLSQLの一部の言語だけで、それら以外は手動でLanguage Injectionを設定することが出来ます。alt + Enterで現れるコンテキストメニューからLanguage Injectionを選択し、候補から選ぶことが出来ます。 シンタックスチェックが行われるのでプレーンテキストではわかりにくかったシンタックスエラーが一目瞭然です。文字列中にHTMLjavascriptを埋

    PhpStormで他の言語を埋め込む - Qiita
    iww
    iww 2017/01/13
    文字列の中にコードを書いたときに、そこの文法チェックとかしてくれるやつ。
  • JavaScriptはなぜトレンドが毎年変わると思われていたのか - Qiita

    JavaScriptはなぜトレンドが毎年変わると思われていたのか JavaScriptのエンジニャーは口を開くたびに出てくるツール名が違う、いつも環境設定をしている、みたいな話をよく聞きます。実際、それを揶揄するようなエントリーが人気だったりします。 とはいえ、JavaScriptを実際に使い込んでいる人は別にそんなに大きな変化だと思っていない節があって、台風は外周部ほど風速が速い、みたいな印象を感じます。 カンブリア紀のJavaScript ウェブサイトをパカパカ動かすための言語でした。DHTMLです。FireBugが出る前のJavaScriptを開発していた人類は、念力デバッグを駆使していました。あるいはalert()。 三畳紀のJavaScript prototype.js、jQuery、Closure Compiler、YUI、mochikit、Ext.jsなどの時代。JavaSc

    JavaScriptはなぜトレンドが毎年変わると思われていたのか - Qiita
    iww
    iww 2017/01/05
    なぜじゃなくて実際に毎年変わっているんだな。 大変そうだ
  • 「JavaScript初級者のためのコーディングガイド」に補足を試みる - Qiita

    はじめに http://qiita.com/raccy/items/bf590d3c10c3f1a2846b を見ていたら、はてブに「理由がないから」ということがよく挙がっていたので、理由をつけてあげたら有益な内容になるかな?と思い、拙いながらも補足を試みようと思います。 【2017 1/3 15:10 追記】 元記事の前提はgulpなどを使ってminifyなども行なえる(もしくは行う目標がある)前提の様子なので、中級者以上がターゲットかなーと思いました。そのつもりで読むととてもいい記事だと思っています。 「最新のJSの書き方を覚えてあとは変換機能に任せればレガシーなJSのキツイところに向き合わなくて済みますよ?」みたいなイメージだとわかりやすいかな? ==、!= 理由 暗黙の型変換が発生して、別の型の比較が真で扱われてしまう場合があるため。 解説 サンプルコードにも出ていますが言葉足らず

    「JavaScript初級者のためのコーディングガイド」に補足を試みる - Qiita
    iww
    iww 2017/01/04
    undefinedに代入しているライブラリは見たことがない。
  • JavaScript初級者のためのコーディングガイド - Qiita

    JavaScriptは大変難しい言語です。Rubyの難易度を2、Cの難易度を5、C++の難易度を8にすると、JavaScriptの難易度は12ぐらいあると思います。このコーディングガイドはそんなJavaScriptの深みに嵌まらないようにするためのJavaScriptの書き方を規定したものです。初級者1のための物ですので、わかってやっている人に好きにやってください。 このコーディングガイドは絶対に従わなければならないものではありません。私は一切強制はしませんし、初級者が従わなければならないという義務もありません。採用するしないはみなさんの自由です。 禁止編 JavaScriptには安易に使用してはいけない機能があります。下記の機能は、それぞれの機能を使っても良い、または、使うべきであるという理由を説明できない限り、使用してはいけません。 ==、!= ==と!=を使用してはいけません。代わり

    JavaScript初級者のためのコーディングガイド - Qiita
    iww
    iww 2017/01/03
    理由が書いてないので、
  • import - JavaScript | MDN

    This feature is well established and works across many devices and browser versions. It’s been available across browsers since May 2018. Learn moreSee full compatibilityReport feedback 静的な import 宣言は、他のモジュールによってエクスポートされた読み込み専用のライブバインディングをインポートするために使用します。インポートしたバインディングは、バインディングをエクスポートしたモジュールによって更新される一方、インポートしているモジュールによって再代入することができないために、「ライブバインディング」と呼ばれています。 ソースファイルの中で import 宣言を使用するためには、ランタイムがそのファイ

    import - JavaScript | MDN
    iww
    iww 2016/12/20
    『この機能は現在どのブラウザにも実装されていません。』
  • 複数ファイルの一括ダウンロード

    Webブラウザで 1. Webページ上の「ダウンロード」リンクをクリックしたら、フォルダ選択のダイアログを表示 2. ユーザーが選択したフォルダに複数のファイルを一括でダウンロード 3. ダウンロードするファイル数は不定(サーバー側で決定) このような要件があるのですが、何らかの方法で実現できるものなのでしょうか。 たとえば、ブラウザの特定のアドオンやプラグインを使用すれば実現できるとか。 クライアントOSは Windows(7以降)です。 ブラウザは Internet Explorer(11以降)が望ましいですが、他のブラウザでも構いません。 サーバーサイドは ASP.NET が前提ですが、他のプラットフォームで実現できるのであれば、それでも良いです。

    複数ファイルの一括ダウンロード
  • JavaScriptでPHPの静的変数(static変数)みたいな事をやる方法 - Qiita

    <?php function test(){ // 変数"$a"を初期化 static $a = 0; // 変数"$a"をカウントアップ $a++; // 変数"$a"の値を返す return $a; } // ループでtest関数を10回実行する for($i = 0; $i < 10; $i++){ echo 'out: ' . test(); echo '<br>'; }

    JavaScriptでPHPの静的変数(static変数)みたいな事をやる方法 - Qiita
    iww
    iww 2016/12/16
    関数のプロパティにぶっこむのが一番お手軽っぽい。 関数名が何度も出るのでコードの見た目は煩雑になる
  • [ASP.NET][C#][JavaScript] 特定のファイルをブラウザにキャッシュさせなくしたい

    js や css ファイルを修正して, ブラウザで試すときに, ブラウザにキャッシュされてしまっており修正が反映されないことがままあります. 私はこれでハマりました. それで, そのファイルだけキャッシュさせなくしたい. そのための方法を, C#(ASP.NET)版と 生のhtmlJavaScript を埋め込む版 の2つ描きました. C#(ASP.NET)版 これを <!-- 修正中のjsファイル --> <script src="/scripts/test.js"></script> こうじゃ! <!-- 修正中のjsファイル --> <script src="/scripts/test.js?timestamp=@DateTime.Now.Ticks.ToString()"></script> こうするとhtmlでは <script src="/scripts/test.js?t

    [ASP.NET][C#][JavaScript] 特定のファイルをブラウザにキャッシュさせなくしたい
    iww
    iww 2016/12/15
    document.writeよりは少しだけスマート
  • 静的サイトで JS/CSS のキャッシュを防ぎつつレポジトリをキレイに保つ

    「ABOUT」のページをリニューアルしました。 1つ前のデザインのままだったものを、現在のデザインに沿って作りなおして、ついでに文章やレイアウトなども整えました。 公開したものの問題発生 意気揚々と公開してみたのですが、1つ問題が見つかりました。 ページを公開したあと、番環境を表示するとデザインが崩れていました。そのあと、ページをリロードすると期待通りの結果になりました。 原因は CSS がキャッシュされていた ことでした。 たとえページが更新されていたとしても、JavaScriptCSS は古いキャッシュを使い続けてしまうことがあります。 で、この問題に対処しようとしたのですが、「静的生成」「生成結果を GitHub で管理」「キャッシュ問題への対策」の 3 つのいいとこ取りをしようとすると、意外に複雑でした。 その話をいまからします。 キャッシュ問題の一般的な解決策 よく見る解

    静的サイトで JS/CSS のキャッシュを防ぎつつレポジトリをキレイに保つ
    iww
    iww 2016/12/15
    めちゃくちゃ強引だ
  • 外部jsのキャッシュを使わせないようにする | cly7796.net

    ファイルを更新したのにユーザー側でキャッシュが残っていて反映されない、といったことを防ぐために、外部ファイル化しているJavaScriptのキャッシュを使わせないようにする方法です。 サンプルコード HTML <script> document.write('<script src="sample.js?' + parseInt((new Date)/1000) + '"><\/script>') </script> ファイルのsrcの後に毎回異なるクエリーが付加されるようにしています。 外部jsのキャッシュを使わせないようにするデモページ 同じ方法で、CSSの読み込みもキャッシュを使わせないようにできると思います。 (JavaScriptオフの環境を想定する場合、noscriptタグでCSSの読み込みも必要です。) 【参考サイト】 ブラウザ上でcssjavascriptのキャッシュを使

    外部jsのキャッシュを使わせないようにする | cly7796.net
    iww
    iww 2016/12/15
    力技。
  • 【ASP】キャッシュを有効にしつつ、cssやjsファイルの変更を確実に反映させる(Cache Busting) - Qiita

    【ASP】キャッシュを有効にしつつ、cssやjsファイルの変更を確実に反映させる(Cache Busting)ASP.NETasp はじめに お仕事で、レガシーASPによる既存アプリケーションの改修作業があり、お客様の方でユーザーテストを実施してもらったのですが、キャッシュが効いてしまい表示が正しく変更されなかったわけです。 ブラウザのキャッシュを削除してもらって正しく表示されたのですが、やはり対応策を求められました。 改修作業自体は何年も前から何度か行っているので、同じようなことは発生していたと思われるのですが、目についてしまったということでしょうか。 対応策

    【ASP】キャッシュを有効にしつつ、cssやjsファイルの変更を確実に反映させる(Cache Busting) - Qiita
    iww
    iww 2016/12/15
    Cache Busting