問題タブ [unobtrusive-javascript]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
ajax - プログレッシブエンハンスメントはどれほど重要だと思いますか?
プログレッシブエンハンスメントは、移植性とアクセシビリティを向上させるだけでなく、開発プロセスを容易にするWeb開発方法論です。
私が欲しいのは、コミュニティの他の人々がこのアプローチについてどう思っているかを知ることです。
特に:Webアプリケーションがサポートする必要のあるテクノロジーの最小セットは何だと思いますか?
javascript - 動的に作成された要素のイベントバインディング?
ページ上のすべての選択ボックスをループし、.hover
イベントをそれらにバインドして、の幅を少し調整するコードがありmouse on/off
ます。
これはページの準備ができたときに発生し、問題なく機能します。
私が抱えている問題は、最初のループの後にAjaxまたはDOMを介して追加した選択ボックスには、イベントがバインドされないことです。
このプラグイン(jQuery Live Query Plugin)を見つけましたが、プラグインを使用してページにさらに5kを追加する前に、jQueryを直接または別のオプションでこれを行う方法を誰かが知っているかどうかを確認したいと思います。
javascript - jqueryを使用した控えめなJavaScript-良い10分のチュートリアル?
JQueryを使用した控えめなJavascriptの10分間の入門書を探しています。私はこの概念にまったく慣れていないので、イベントバインディングなどがどのように機能するかを確認したいと思います。
背景として、私はここSOで行っているのと同様の「このタグを削除する」システムを実行しようとしています。ソースを見ると、jsは表示されず、imgタグのみが表示されました。それは私にクリックイベントにバインドしている外部のjsがなければならないと思います。その方法を知りたいのですが、その方法を示すチュートリアルが必要です。
jquery - jQueryのDOM要素へのデータの関連付け
前の人生で、私はこのようなことをしたかもしれません:
jQueryを使用すると、次のようなことができます。
alt属性を使用してDOMからjQueryにデータを渡すことは、意図された目的ではないため、ハックのように感じることを除いて。jQueryがアクセスするためにDOMにデータを保存/非表示にするためのここでのベストプラクティスは何ですか?
javascript - Low Pro Prototype DOM Builder は IE で動作しますか?
Dan Webb による Prototype へのLow Pro UJS 拡張機能は、次のエレガントな DOM ビルダーを提供します。
これは Firefox と Safari では夢のように機能しますが、IE 6 と IE7 では「オブジェクトはこのプロパティまたはメソッドをサポートしていません」というエラーで大喜びします。
IE と互換性のない Element.new をラップするために Dan Webb の DOM Builder が何をしているのかについての洞察はありますか?
javascript - サーバーバックエンドからjavascriptに変数を渡す正しい方法は?
phpが認識している変数をjavascriptコードに渡す必要がありますが、これを行う正しい方法は何でしょうか。
これをページ生成に追加できることはすでに知っています。
しかし、私はこの方法が私が望むよりも邪魔になると思います。これを行うためのより良い方法があるかどうか疑問に思っていますか、それともビュースクリプトにインラインJavaScriptコードを挿入する必要があるだけですか?
javascript - JQuery トグル VAT 切り替え
クライアント側でのみ実行したいのですが、 http://aria.co.ukの右上隅に表示されているように、VAT スイッチャーを実装したいと考えています。
以下は私が思いついたものですが、必要があります:
- VAT を前後に切り替えます (私の例は一方通行です)。
- 永続性のために Cookie からトグル状態を保存して読み取る
目立たないようにする / JS が利用可能な場合にのみ切り替えリンクを表示する
<html>
<head>
<title>VAT Switch</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
function VATswitch(){
var price = $(".price strong span").text();
price = price * 10 / 12;
$(".price strong span").text(price);
var excl_incl = $(".price em").text();
excl_incl = "(excl. VAT)";
$(".price em").text(excl_incl);
}
</script>
</head>
<body>
<a href="#" onclick="VATswitch();" id="vat_switch">Switch VAT</a>
<p class="price">
<strong>£<span>120</span></strong>
<em>(incl. VAT)</em>
</p>
</body>
</html>
助けてください。
javascript - JS スクリプトがロードされたことを通知する最良の方法
私のサーバーでホストされ、他の人がhtmlに埋め込むJSスクリプトがあります。
Object()
私のスクリプトは、 Javascriptとして使用するためにアクセス可能な一連のプロパティを持つオブジェクトを宣言します。
ロード時間の違いにより、スクリプト内の「Awesome」オブジェクトの準備が整ったことを知らせる必要があるようです。これは自立する必要があるため、特定の JS フレームワークに依存しません。
独自のカスタム JS イベントを発行する必要がありますか?それとも、スクリプトが読み込まれるという単純な事実が、既存のページレベル イベントの 1 つによってキャプチャされるのでしょうか? 他にどのようにすればよいですか?
更新: 参考までに、から実行されている HTML ページに JS を含めるとhttp://mysite.example.com
、Awesome オブジェクトが使用可能になり、データが取り込まれます。JS ファイルが別のドメインからインクルードされると、オブジェクトは実行時に未定義になります。
javascript - Web開発者向けのJavaScriptライブラリの提供
これは、他のWeb開発者が自分のサイトで使用するJavaScriptライブラリの提供に関する幅広い質問です。これが私のライブラリの範囲です:
- JSファイルの形で提供されるデータサービスを提供しています。同様の実装はGoogleAnalyticsです。
- 常に私がホストします。開発者は、<script>タグの@src属性を使用するだけです。
- 私のライブラリは、一連のプロパティを持つオブジェクト(今はJeffと呼びましょう)で構成されています。メソッドはなく、値だけです。
- ライブラリは静的ではありませんが、代わりにセッションベースです。リクエスト時にのみ決定できるデータポイントを提供しています。(通常はAJAXを介して呼び出され、ページの読み込み時に利用できるWebサービスを考えてみてください。)
- これは無料のサービスではありません。実装者は使用料を支払います。
- サーバーで発生したランタイムエラーのためにすべてのプロパティが設定されているわけではありませんが、Jeffオブジェクトは常に返されます。Jeffオブジェクトには、成功/失敗を示す応答セクションと説明が含まれています。
さて、私の質問に:私が説明したようなJSライブラリの形でサービスを提供するためのベストプラクティスの観点から理想的なものは何ですか?標準のグーグルは私に先に進むことをあまり与えませんでしたが、ガイドラインへの参照は大いにありがたいです。
jquery - JQuery:なぜOnClickイベントではなく控えめなJavaScript /ドキュメントレディ機能なのですか?
JQueryを見始めたところです。現在、WebアプリケーションにAJAXはありません。
HTML内の既存のJavaScriptは次のようになります。
[追加]と[検索]のボタンが表示されます。検索の場合、フォームを送信する必要があります。MyFormSubmit()を使用して、データを検証し、ページに視覚効果を追加してから、データをPOSTします。
[検索]ボタンのにクラスまたはIDを追加すると、JQueryで次のように記述できます。
JQueryを理解する「初心者」の段階では、なぜこのようにするのかわかりません。
私の古い方法は、オブジェクトの近くのメソッドを識別します。ユーザーがボタンを押す前にJSがロードされていない可能性があります(そこにありますか?JSのロードはページの上部にあります)。
JQuery Document Readyメソッドは、ドキュメントが読み込まれるまでアクティブ化されませんが(JSがすべて存在し、実行の準備ができていることを保証しますか?)、コードをHTMLファイルの別の部分に移動します。 HTMLソースにMyButtonArrayDIVが表示されますが、どのオブジェクトにメソッドがあり、どのオブジェクトにメソッドがないかはわかりません。
私の選択肢が何であるか、そして私が注意すべき利点/落とし穴を理解するのを手伝ってくれませんか?
編集:クラス「LightBoxThumb」のサムネイルがクリックされたときに表示されるLightBoxなどのDOM操作では、控えめなJavascriptが使用されることに満足しています。
しかし、特定のアクションを持つボタンには、その方法を適用する必要があると自分自身を説得するのに苦労しています。(私は確かに「他の場所」への単一の関数呼び出し以外のコードをボタンに配置しませんが、そのボタンが何をするかについての私の最善の手がかりであり、控えめなJavascriptのレイヤーはそれをはるかに難しくする可能性があります決定する。)
Edit2-承認された回答
私はラスカムズの答えを取りました。控えめなJavascriptについて、それをいつどのように使用するかを理解するのに役立つ方法で説明しています。
今のところ(経験が増えると変更される可能性があります)、デバッグが容易になると感じたため、オブジェクトに対する単一の変更されないアクションのOnClickイベントを使用し、問題が発生したかどうかを診断します。 。見出し列をクリックして並べ替えることができるテーブル上のZebraStripes(およびそのタイプの状況)の場合、控えめなJavascriptアプローチの利点を確認できます
ラスの最後のコメントは特に役に立ち、ここで繰り返されました:
「@Kristen-そうです、多くのプログラミングトピックのように、複数のアプローチがあり、人々は彼らの信念を熱心に支持します!単一のボタンの単一の方法について話している場合、私はあなたがどこにいるのかを完全に理解していますから来ています...
複数の要素に対する同じ関数呼び出し、異なるメソッドに対する異なる関数呼び出しなど、多くのJavaScriptについて話している場合、インラインアプローチと目立たないアプローチを組み合わせるのは難しいと思います。どちらか一方のアプローチを採用する方が良い」