2011 2011年2 18日

IEのJavascriptのエラー:オブジェクトはこのプロパティまたはメソッドをサポートしていません。

Javascriptの部分は通常のバーのIEのようにすべてのブラウザansにうまく働いたこの奇妙な問題を持っていた :) シンプルな...それはあったが、スクリプトは私が書かれていなかったので、それだけIEが投げたことをこの "オブジェクトはこのプロパティまたはメソッドをサポートしていません"エラーをデバッグするには時間がかかりました。 おそらく! 私がスクリプトを記述した場合、私はフィールドID :)と私の変数名を混在させないように、すべてでこのエラーを持っているはありません。

問題:オブジェクトはこのプロパティまたはメソッドを(3行目)をサポートしていません

function funzoneSP(){ document.getElementById('video_id').style.visibility="hidden"; shortdesc = document.getElementById('shortdesc').value; .... } 

ソリューション:
エラーは上記の例(3行目... "shortDesc属性= document.getE ....")のthirdrowで生成されます。 私もここで言及する価値がある私はドント愚かなもののすべての並べ替えをしようとした最終的に何を推測! ちょうど何か他のものにshortDesc属性varを変更すると、エラーを処分した。 基本的に! 変数名は、fieldIDは異なるしなければならなかった


2009 2009年3 24

= "true"を無効にすると同じ= "false"を無効にされていますか

このものを古い学校が、それは私の記憶のサプリメントですいつものように...
したがって、= "true"を、無効= "false"を同じ無効になっていますか?
......まあ、信じてはいけない! それは...ここの方法はいくつかの簡単な説明であるthatsの...
"無効"フォーム要素/フィールドのいずれかの属性であるため、その性質により、任意の値を受け入れることができます。

この属性が存在する限り、同様に、要素はその値に関係なく無効になります。 例のために。
<input type="text" value="Thisですdisabled"が無効化さ
<input type="text" value="Thisですdisabled" disabled="disabled">
<input type="text" value="Thisですdisabled" disabled="true">
<input type="text" value="Thisですdisabled" disabled="false">

上記のすべては、このフォームフィールドに "DISABLED"になります。

単に属性 "DISABLEDは、"フィールド "エーブル"を維持...以下のように提供していない

<input type="text" value="Thisは/> disabled"はありません

覚えている"disabled属性の任意の値(またはまったく値)を、ブラウザはそれが無効になってレンダリングされます 。" 私たちの心のW3Cで物事を明確に維持するためには、私たちがこのような状況で無効になって= "無効"を使用することをお勧めします。

これはJavaScriptでこの属性を使用する場合でも違いは...

document.form.element.disabled = TRUE; / /要素は無効化されます
document.form.element.disabled = falseは、/ /要素が有効になります

上記の引数は、これらの属性および要素にも当てはまります。

  • (ラジオボタンとチェックボックス)をチェック
  • (オプション)を選択し
  • パラメータnowrap(TD)

2009 2009年 3 7

JavaScriptで複数のWindowsのonload関数を呼び出す

私は状況がそれをcommanedので、周りに掘ってあったことをJavascriptの策略の別の小さなピースはHERESに。 私のWebサイトのいずれかで、私は二回 "windows.onload"を実装しなければならなかったこのような状況があった。 私のような未熟な心(私は正直なところ私はjavascriptのフレームワークやライブラリを使用しているので、私は自分自身...悲しいですが本当で、単純な物事を行うには忘れられたました、と言わざるを得ない)となりましたでしょうまず最初に、次のメソッドです。 ...

にwindow.onload = onloadfn1。
にwindow.onload = onloadfn2。
にwindow.onload = onloadfn3。
等..

残念ですが、これは文句を言わない仕事... Javascriptの多くの実行科学を議論したくない...しかし、私の最近の経験によれば、最後の関数(onloadfn3)病気が実際に実行されます。

通常の状況では、私(私は後で少し話をします)とは違って...あなたはmutlipleのonload関数を実行するには、次のいずれかを行うことができ....

このようにまたは何か

関数doOnLoad(){
         onloadfn1();
         onloadfn2();
         onloadfn3();
 }
にwindow.onload = doOnLoad。

私の現在の状況については、私は上記のいずれかを使用することはできません...
なぜ私は、単一のonload関数内の2つの関数を呼び出すことなく、windows.onload回呼び出す必要がありましたか? ここに私の問題文をざっと見ては...

"個人用サイトのページは、WordPressのテーマのように構成されています.... つまり、すべてのサイトのページに含まれる共通のheader.phpのとFooter.phpがあります。 いくつかの共通のonload関数を実行するFooter.phpのonload関数のimplementaionがあります。 とは別に共通のonload関数によって行われたものから自分のONLOADの何かに必要があるいくつかのページがあります。 私はにwindow.onloadハンドラに直接コールバック関数を割り当てる場合は、 "Footer.phpで以前に割り当てられたコールバックをオーバー乗ります。

.... 私の問題は理解されている :)

よく! 私が見つけなかったことをいくつかのソリューションがあります。 それらはすべて非常に類似しており、主にサイモン·ウイルソン(で指定された溶液のimplementions http://simonwillison.net/2004/May/26/addLoadEvent/ )...

ソリューション:

単にサイトにこのjavascriptのコードを追加します。...

機能addLoadEvent(FUNC){
     VAR oldonload =にwindow.onload;
    もし(typeof演算にwindow.onload!= '関数'){
       にwindow.onload =関数
     する} else {
       にwindow.onload =関数(){
            {(oldonload)の場合
                   oldonload()
           }
           func()を
        }
    }
 }

代わりに、通常の "windows.onload"のそれを呼び出す

 addLoadEvent(FunctionToRunOnPageLoad);
 addLoadEvent(関数(){
ページのロード*上で実行する/ *さらにコード
 }); 

このコードスニペットの利点は...
1。 主に、それは以前の定義をオーバーライドすることなく、あなたのコードの別々の部品から呼び出され、複数のwindows.onloadイベントを持っていることができます
2。 それは本当に控えめです。 それはあなたの他のスクリプトとファイル内、または別のファイルに配置することができます。
3。 それはにwindow.onloadがすでに設定されている場合でも機能します。


2008 2008年 12月 25

動的にロードするJavaScript

時にはpageweightを保つために...私たちは断片に私たちのスクリプトを分割している...必要なときにこれらのJavaScriptの断片は次のようにロードされ、することができます(イベントまたはその他のリンクやボタンのクリックを参照)。

Javascriptをロードすると、動的にシンプルで単純明快以下のようには...

= “text/javascript” > < スクリプトの タイプ = "text / javascriptに">
機能loadNewScript(ソース){
varの= document.createElement( 'スクリプト');
s.setAttribute( 'タイプ'、 'テキスト/ javascriptの');
s.setAttribute( 'src'には、ソース);
document.body.appendChild(秒)。
}
</ SCRIPT>

とどこにでも体内の次の呼び出しリンクを持つことができるか、文書自体は、このスクリプトの "onload"を持つことができます...

= “javascript:loadNewScript('myDynamicScript.js');” >Load Dynamic Script</ a >、<a href = の"javascript:loadNewScript( 'myDynamicScript.js');">負荷動的スクリプト</ a>を

または

<body onload="loadNewScript('myDynamicScript.js');">


2008 2008年 10月 3

あなたのウェブページのために、シンプルで軽量、クロスブラウザのライト

わずかライトのときには、Googleを見つけることができ、それは存在しないこと。 私が見つけた物のほとんどの問題は、それらが皆、1つまたはjQuery、プロトタイプ、MooToolsのと同類のような他の重量のJavaScriptフレームワークを使用するように見えたということでした。 彼らはすべてのクールで見てしゃれています。 しかし、あなたの要件である" しかし、私は私のサイトの場合は単純で軽量なライトボックスのスクリプトを使用したい "場合は、ここにある。

このライトボックスの気の利いた機能

  1. 非常に軽い
    パックされたスクリプトの4キロバイト(8キロバイトはアンパック)
    B。 CSSの2キロバイト
    C。 物コンテナのHTMLに数行の
  2. 理解し、実装するのが簡単
  3. 同じページに複数のライトを持つことができます。
  4. 同じ物コンテナがクリックされたリンク/オプションに応じて、(別ページに隠された部門として含まれている)、さまざまなコンテンツを表示するために使用されています。
  5. 自動的にページスクロール量と物の内容の高さは、考慮などのウィンドウの高さと幅(画面解像度)など、すべての要因を取って、自身を中心
  6. IE 7&FFでテスト

デモを見る |
ライトボックスのダウンロードソースの郵便番号(1801回ダウンロードされる)


[ZIPファイル内のファイル]ボックスを使用して、

jo.js、jo_pack.js [パックバージョン]: -要素は、ウィンドウやドキュメントの位置決めスクリプトを含むJavaScriptオブジェクトの単純なセット[JO]、。 あなたには、いくつかの高度なJavascriptingを持つ手が汚れて取得したいのであれば、抽象的な機能は、拡張要素のプロパティなどを作成し、JO.JSを開くことができます。 Javascriptingであなたはあまりされていない場合は、単独でそれを残す。

lightbox.js、lightbox_pack.js [パックバージョン]: -ライトボックスマネージャのスクリプトが含まれています。 ページ上でライトを実装するのにも責任を負いページデザイナーである場合、あなたはLightBoxManagerを理解する必要があります。 LightBoxManagerは基本的には2つの関数showLightBoxとcloseLightBoxが含まれています。

lightbox.css: -あなたがCSSを知っていれば、あなたはルック·アンド·フィールlightbox.cssをカスタマイズするには、lightbox.cssで遊ぶことができ

index.htmlの 2つの異なるコンテンツを持つ物のサンプル実装

lb_underlay_bkg.png: - [建築が開いている間は、アンダーレイは、ページ上の他のエンティティをクリックしてからユーザーを防ぐことができlighbox、下の層である]これは、ライトの下敷きの背景を使用されているシミ/光透明なイメージです。 ページのデザインと要件に応じて、さらに任意のイメージまたはこの目的のためにソリッドカラーを使用することができます。

icon_lb_close.gif: -ライトボックスの右上のcloseライトハンドルのイメージ。 デザインごとに、任意の画像を使用することができます

デモを見る |
ライトボックスのダウンロードソースの郵便番号(1801回ダウンロードされる)

私たちはあなたのコメントやフィードバックを持たせてください...


2008 2008年 9月 13

JavaScriptを:ブラウザの[編集] Webページ

まあ、私は科学のような有用部分ではなく、言う必要がありますが、Web開発者である場合(または、それでしょうか?)いつか、便利来るかもしれない。 ここで任意のサイトのWebページを編集することができます小さなブックマークレットです。
と申し訳ありません! あなたは、あなたのローカルマシン上に結果を保存することができます。

ジャバスクリプト:document.body.contentEditable = 'TRUE'; document.designMode = 'で';ボイド0


2008 2008年 9月 2

CSSハックのみ:FirefoxのJavascriptやCSS、HTML

何度も我々には、ブラウザspecficハックを(それが良い習慣ではありませんが、我々のUI開発者は、戦争が休戦になる偉大なブラウザになるまでそのような弊害に頼らなければならない)記述する必要を感じています。 以前、私はこの資料に記載していただけにIEの方法のみ<IE7 IEブラウザに表示されるであろうCSSのスニペットを書き込むには、。

昨日、私はいくつかのFirefox固有のCSSのスニペットを書きたかったケースを持っていた。 よく! 私はこのためのCSSコードがあるかどうか分かりませんが、HTMLがある。 もののキャッチありますが 、HTML鞭のこの部分は、HTMLの検証を渡します。 しかし、anywaz! あなたがひどく、またはのようなスタックされている場合は、検証のための無よろしく(いつか私たちは残酷なことする必要があります)がありません、あなたはFFのみスタイルシートへのリンクを宣言するには、次を使用するかだけでも、このブロック内のCSSをコーディングすることができます。 コー​​ドは

<COMMENT>ここにFirefoxのみHTML / CSS /スクリプトを入れて</コメント>

例えば、
<COMMENT>
<STYLE>
/ * FFのスタイルのみ* /
fieldset要素{国境:1px固体#DDDDDD;}
</ STYLE>
</コメント>

私は "一瞬メートル幸せ...


2008 2008年 9月 1

渡された文字列に一致するJavaScriptの配列から特定 ​​の項目を削除

ここにちょうどそれを行うには、ネイティブのJavaScriptのArrayオブジェクトを拡張する簡単な方法は、だ...

Array.prototype. removeItem =function(str) {
for(i=0; i<this.length ; i++){
if(escape(this[i]).match(escape(str.trim()))){
this.splice(i, 1); break;
}
}
return this;
}

だから今は、このような何かをすることができます...

var animals= new Array("dog","lion","cat","tiger","elephant");
animals. removeItem ('tiger');

今すぐ動物の配列は、 "ライオン"、 "猫"、 "象"を "犬"を含むでしょう。

ここで、あまりにも文字列のトリムのプロトタイプです...:PS

String.prototype.trim=function(str) {
str = this != window? this : str;
return str.replace(/^\s+/g, '').replace(/\s+$/g, '');
}


お楽しみください....


2008 2008年 5月 15

ベストプラクティス:JavaScriptのでの作業

JavaScriptのHTML文書の最後にを含む

あなたのスクリプトで、ページのコンテンツの一部を挿入するdocument.writeを(もしくはJavaScriptを使用してページの内容のいずれかを動的に生成)されていない場合は、BODYタグの終わりの前にページの一番下に文を含むスクリプトを移動します。
HTTP/1.1仕様書は、ブラウザがホスト名ごとに並列に2つ以下のコンポーネントをダウンロードすることを示唆している。 あなたが複数のホストからあなたのイメージを提供する場合には、並行して発生するつ以上のダウンロードを得ることができます。 スクリプトがダウンロードされていますが、しかし、ブラウザはさらに別のホスト名には、他のダウンロードを開始しません。
動的にスクリプトノードを作成し、ページがAJAXを使用してロードされた後、リモートスクリプトをロードする方法もあります。

JavaScriptのあなたをExt​​ernalise

JavaScriptファイルがブラウザによってキャッシュされるため、外部のJavaScriptファイルを使用すると、ページのロードが高速になります。 インラインJavaScriptの 'HTML文書には、HTMLドキュメントが要求されるたびにダウンロードされる。 これは実際に行われたHTTP要求の数を減らすかもしれないが、その後、HTMLドキュメントのサイズが大きくなります。 外部JavaScriptのは、ブラウザによってキャッシュされます。HTMLドキュメントのサイズは、HTTPリクエストの数を増やすことなく削減されます。
あなたのサイト上のユーザーがセッションごとに複数のページビューを持っていて、ページを再使用するのと同じスクリプトとスタイルシートの多くの場合、キャッシュされた外部ファイルからより多くの潜在的な利点がありますのでご注意ください。

JavaScriptファイルをパックする

JavaScriptの場合には、CSSとは異なり、ファイルは単にスペースまたはタブを削除するよりも縮小ファイルサイズを与えるであろういくつかの標準的なアルゴリズムを使用してクランチ可能性があります。 JavaScriptのパッカーの例はここhttp://dean.edwards.name/packer/見つけることができます

任意のスクリプトが重複を取り除く

それは全体のスクリプトが重複する可能性があることは非常に珍しいですが、10上の米国Webサイトの見直しは、それらの2が重複するスクリプトが含まれていることを示しています。 スクリプトが重複していますが、明らかに不必要なHTTPリクエストと無駄なJavaScriptの実行を作成することにより、パフォーマンスが低下します。
スクリプト名が異なるものの、また、多くの場合、スクリプトのチームのサイズと数のため、同じページ内のスクリプトが重複する可能性があります。

可能であれば、DOM要素にアクセスして最小限に抑える

JavaScriptでDOM要素にアクセスすると、より応答ページを持つために非常に遅いですが、以下を行う必要があります。
アクセスの要素に•キャッシュ参照
• "オフライン"ノードを更新してツリーに追加
•JavaScriptを使用してレイアウトを固定しないでください

コンテンツとプレゼンテーションから独立した動作

単にコンテンツ(XHTML / XML)から我々は独立したプレゼンテーション(CSS / XSLT)として、我々はまた、動作(JavaScript)を分離する必要があります。 これは控えめなJavaScriptと呼ばれています。 我々は外部CSSファイルへのリンクと同じように、我々は外部のJavaScriptファイルにリンクする必要があります。

代わりに、コンテンツ(例えば、onmouseoverイベントは、onclickなど)にハードコーディングする動作のため、動作が動的に要素、クラス、およびDOMを使用して一意の要素(ID)を追加する必要があります。 基礎的なドキュメント、コンテンツは、唯一の有効なXHTML / XMLとしないjavascriptを含める必要があります。
Javascriptが動作を追加することにより、コンテンツを強化する必要があります。 コンテンツにはJavaScript(または完全なJavaScriptサポートを持たない)を使用せずに有用であり、使用可能なままにしてください。


2008 2008年3 15

ポップアップ部門を通して見える刺激する選択ボックス

いくつかの場面で、ポップアップ部門/ライト/ヒントを使用してページレイアウトをしている間は、我々が何らかの形でSELECTオブジェクトが設計することにより、これらのPOPUP部門の下にあることを起こる、それが透けて状況に遭遇formula要素.... YUK!

よく! 簡単にFFとIE7のために適切にZ-INDEX値を調整することによってこの問題を解決可能性があります。 しかし、グッド·オールド(しゃれ)IE6は意図したとおりに動作しません.... でも、あなたはポップアップ部にいくつかの大幅な高Z-INDEX値を適用した後、SELECT BOXショーを通じ、...がっかり!!

この問題に対する修正はありませんが、ありますが、私は信じて、この問題を回避するには、いくつかの方法よりも、しかし、のほとんどで、私のため正常に動作している、あなたに私が使用する最も簡単な解決策を教えてここでイム例....

"あなたがPOPUPを表示するときROUGE選択ボックスを隠す "

単にあなたのスクリプトのスニペットで、あなたのポップアップを表示する場合には、 "hidden"にSELECTボックスの可視性を設定するスクリプトの一部を追加する

のdocument.getElementById( 'my_select')style.visibilty = "隠された";

そして、あなたのポップアップ部門のCLOSEにそれをセットバックすることを忘れないでください

のdocument.getElementById( 'my_select')style.visibilty = "見える化"。

"my_select"は刺激選択ボックスのIDです。

この情報がお役に立てば幸いです...

PS。 動的にポップアップDIVの下にIFRAME(あなたポップアップと同じサイズ)をpositioniningようにofcourseの他のオプションがあります...これはあまりにも動作しますが、DOMエレメント、スクリプトや頭痛の負荷を加えた。 私もこのソリューションを使用して、あなたがこのオプションを使用して任意の助けを必要とするならば、私に知らせてください。 助けて喜んでいるでしょう!


NDKホーム | ITを表現 | 表現口蓋 | Penmenshipを表現 | 表現する素晴らしい | 自分を表現