タグ付けされた質問 「javascript」

JavaScript(JS)は、ユーザーとの対話、ブラウザの制御、非同期通信、および表示されるドキュメントコンテンツの変更を可能にするクライアント側スクリプト言語です。デフォルトでは、Magento 1にはprototype.jsライブラリが付属し、Magento 2にはjQueryが付属しています。これらのライブラリーに関する質問には、「prototype-js」および「jquery」タグを使用してください。

4
Magento 2にjQueryライブラリを追加する
サードパーティの開発者はどのようにしてjQueryライブラリをMagento 2に追加できますか? Magento 2のフロントエンドテーマにはjQueryのバージョンが含まれていますが、jQueryオブジェクトはグローバル名前空間ですぐには使用できません。これは、Magento 2がRequireJSを使用してjQueryをプルし、RequireJSが必要になるまでモジュールファイルをロードしないためです。 これは、jQueryプラグインの問題を示しています。通常、このようなHTMLのプラグインを含めます <script type="text/javascript" src="http://magento-1-9-2-2.dev/js/commercebug/jquery-ui-1.8.custom/js/jquery.cookie.js"></script> ただし、これはMagento 2では不可能jquery.cookie.jsです。ファイルはグローバルjQueryオブジェクトを使用してjQueryプラグインを定義するため、Magento 2ではjQuery is not definedエラーで失敗します。 フロントエンドの開発者は、Magento 2のフロントエンドアプリケーションに標準のjqueryプラグインライブラリをどのように含めるべきですか?

4
Magento2ローカライズJavascript
同様の質問がすでにここで尋ねられました:Magento 2 javascript text translations、Magentoはベータ版でこの翻訳技術を更新しました。 Javascriptで使用される翻訳を追加または更新するにはどうすればよいですか? Magentoが静的フォルダーに「js-translation.json」というファイルを作成することがわかりました。このファイルを直接編集すると、翻訳が更新されていることがわかります。しかし、このファイルはどこで作成されますか?また、Magentoが生成時にjs-translation.jsonに自動的に追加するように翻訳を追加するにはどうすればよいですか? 更新 この質問に対する正しい答えはまだ出ていませんが、Mage2.PROは正しい方向を示してくれましたが、完全な答えではありません。私のjs-translation.jsonは、生成されるとまだ空です。 たとえば、[カートに追加]ボタンを翻訳したいです。このボタンには、カートに追加、追加...、追加...の3つの状態があります。これらの単語を翻訳するにはどうすればよいですか?別の例として、「ショッピングカートに商品がありません。」ミニカート内のテキスト。これらのフレーズはすべてjs-translation.jsonから翻訳する必要があると思いますが、これらのフレーズがどこに追加されてこれらのファイルがこれらの翻訳で埋められるのでしょうか?

1
Magento 2の配送方法選択でカスタムブロックを表示する方法
参照リンクを使用して、1ページのチェックアウトで以下の配送方法にカスタムブロックを追加する方法は?、下部に追加の配送ブロックを作成できます。 ただし、配送方法が選択されている場合にのみコンテンツを表示したいと思います。顧客が配送方法を選択すると、カーソルが追加情報とカスタムフィールドに移動し、ユーザーがデータを入力する必要があります。 別の配送方法を選択すると、それに関連する情報が存在する場合、それ以外の場合はdivが非表示になります。 Magento 2のhttp://excellencemagentoblog.com/blog/2011/11/07/magento-advanced-shipping-method-development/のように同じです。Magento1で実装していました。

1
Magento2:コアjsモジュールprice-box.jsをオーバーライドする方法
私は拡張する必要がありますMagento_Catalog/js/price-box.js。「ミックスイン」機能を使用しましたが、では機能しませんprice-box.js。 requirejs-config.js: var config = { config: { mixins: { 'Magento_Catalog/js/price-box': { 'My_Module/js/price-box/pluggin': true } } } }; My_Module/view/frontend/web/js/price-box/pluggin.js define(function () { 'use strict'; return function (target) { // modify target var reloadPrice = target.reloadPrice; target.reloadPrice = function() { cosole.log("hello"); }; return target; }; });

4
ページスピード - 上記の倍の量でレンダリングブロックJavaScriptとCSSを排除
私が実行しているmagento 1.9、と私は使用していますRWD sliderホームページにMagentoの1.9が付属しているが。 Google PageSpeedはこれを好まず、次のように述べています。 レンダリングブロックJavaScriptとCSS以上の倍の量で解消 スライダーを呼び出すこのjavaスクリプトファイルに対して、どうすればよいですか。 http://www.MYDOMAIN/media/js/sdhfksjfhdsjvbskj8e4w.js

3
CSSとJSインクルードをフッターに追加するMagento
MagentoサイトのYslow最適化をいくつか行っており、CSSとJsをサイトのフッターに追加しようとしています。 現時点では、レイアウトXMLでヘッド参照タグを使用し、すべてのファイルを含めるためにaddJsおよびaddCssアクションを使用しています。フッターへのヘッド参照を交換しようとしましたが、サイトを表示しようとしたときにエラーが発生しました。これを行う方法はありlocal.xml ますか、フッターテンプレートファイル自体にハードコーディングする必要がありますか?
15 layout  javascript  css 

2
CSSまたはJSをマージすると、ページタイプごとに新しいファイルが生成されます
たくさんの小さなCSSファイルとJSファイルがあり、マージを有効にすることは良い選択のようです。 CSSおよびJSファイルの多くは、すべてのページ(ホームページ、カテゴリページ、製品詳細ページ)で使用されます。 別のマージされたファイルが各ページに再度ロードされるのを見るたびに、含まれるCSSでさえ重複している必要があります。 どうすればこれを回避し、より多くのデータを再利用できますか?

1
Magento 2:別のphtmlファイルでカスタムオプションを表示する方法
カスタムオプションでこの位置をオーバーライドして、別のphtmlファイルに表示するにはどうすればよいですか。 このコードを追加し、ファイルcheckout_cart_index.xmlをオーバーライドしないのみをform.phtmlオーバーライドしdefault.phtmlます。 <?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <!-- <update handle="checkout_cart_item_renderers"/> --> <body> <referenceContainer name="content"> <referenceBlock name="checkout.cart.form"> <action method="setTemplate"> <argument name="template" xsi:type="string">Bespoke_Bespoke::cart/form.phtml</argument> </action> </referenceBlock> <referenceBlock name="checkout.cart.item.renderers.override"> <action method="setTemplate"> <argument name="template" xsi:type="string">Bespoke_Bespoke::cart/item/default.phtml</argument> </action> </referenceBlock> </referenceContainer> </body> checkout.cart.item.renderersエイリアス「シンプル」の子がすでにあるというエラーが発生していますcheckout_cart_item_renderer.xml <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <!-- <update handle="checkout_item_price_renderers"/> --> <body> <referenceBlock name="checkout.cart.form"> <action method="setOverriddenTemplates"> <argument xsi:type="array"> <!-- …

3
Magento 2:バックエンドとフロントエンドの状態/キャッシュの同期
Magento 2には、バックエンドとフロントエンドのローカルストレージ間の状態を管理するためのシステムまたは抽象化がありますか? リダイレクトURLを介してユーザーの放棄されたカートを復元する機能の移植に取り組んでいます。簡易形式では、次のようなURL http://magento.example.com/restore/the/cart?identifier=sdkfjh48v237g5 識別子のエンコードされたquote_idに基づいて、現在のユーザーのカートに見積もりをロードします。 Magento 1では、これは比較的簡単でした。ユーザーのCheckoutセッション情報を正しい見積もりIDで更新する必要がありました。ただし、Magento 2はローカルストレージのしわを追加します。 Magento 2フロントエンドjavascriptアプリケーションは、ブラウザのローカルストレージデータベースに情報をキャッシュするようです。これには、ミニカートを構築するための情報が含まれます。これが意味することは、エンドユーザープログラマー(私)がバックエンドのセッションセッションIDを変更したとしても、ミニカートには古いカートデータが表示されます。 これは、バックエンドとフロントエンド全体でアプリケーションの状態を管理するための単一のAPIを知らない(または持っている?)ことから生じる問題の一例です。特定の問題のために、JavaScriptを含むHTMLページをエンドポイントでレンダリングして、ローカルストレージを手動でクリアし、ユーザーを別のページにリダイレクトしましたが、これはひどいハックのように感じます。 フロントエンドとバックエンドの間でデータを管理するためのMagento 2にAPIはありますか? バックエンドの処理中に、フロントエンドのローカルストレージキャッシュを無効にする必要があるようなことをしたシステム全体に信号を送る標準的な方法はありますか? 自動的に実行され、残りのjavascriptアプリケーションがアクセスする前にローカルストレージを操作できる新しいRequireJSモジュールをページに挿入する方法はありますか?

2
開始日と終了日の検証
私は、ユーザーが選択したい管理フォームに取り組んできたStart DateとEnd Date。 End Dateがより大きい必要があるような検証を提供する必要がありますStart Date。 上記のシナリオで、開始日と終了日のデフォルトのMagento検証クラスを提供するのに役立つ人はいますか? デフォルトのMagento検証では不可能な場合、plsはカスタムJSコードをポストします。 また、これは日付範囲の私のフォームです $dateFormatIso = Mage::app()->getLocale()->getDateFormat( Mage_Core_Model_Locale::FORMAT_TYPE_SHORT ); $fieldset->addField('start_date', 'date', array( 'label' => Mage::helper('myhelper')->__('Start Date'), 'name' => 'start_date', 'note' => $this->__('Start Date'), 'required' => true, 'image' => $this->getSkinUrl('images/grid-cal.gif'), 'format' => $dateFormatIso, 'class' => 'required-entry validate-date validate-date-range date-range-start_date-from' )); $fieldset->addField('end_date', 'date', array( 'label' => Mage::helper('myhelper')->__('End …

2
Magento 2: `<each />`タグとは何ですか?
私が知る限り、Magentoのバックエンドでグリッドを表示すると、次の「XHRにロードされた」KnockoutJSテンプレートが物事のレンダリングを開始します File: vendor/magento//module-ui/view/base/web/templates/collection.html URL: http://magento.example.xom/pub/static/adminhtml/Magento/backend/en_US/Magento_Ui/templates/collection.html &lt;each args="data: elems, as: 'element'"&gt; &lt;render if="hasTemplate()"/&gt; &lt;/each&gt; しかし、私は&lt;each/&gt;タグと&lt;render/&gt;タグが何であるかについて少し損をしています。それらは、ストックKnockoutJSの一部ではありません(またはそうではないようです)。 componentsを介してKnockoutJSにカスタムタグを追加できることは知っていますが、KnockoutJSに名前が付けられたコンポーネントeachまたはrenderKnockoutJSに追加された明白な場所は見当たりません。 ですから、これらが私が知らない場所に登録されたコンポーネントなのか、MagentoがKnockoutJSに対して行ったカスタムタグなどを完全にカスタマイズしたものなのかはわかりません。 注:私はここで完全に暗闇ではありません&lt;each/&gt;-JSONでレンダリングされたすべての子UIコンポーネントを反復処理し、そのテンプレートをレンダリングします(そのテンプレートが存在する場合)。 私がまったく明らかにしていないのは、これらのタグの実装方法です。データがどのようにバインドされているかをデバッグできるように、それらが実装されている場所を確認し、他のタグがある場合にMagentoがこれらのタグを作成するために使用するメカニズムを理解します。

2
Magento 2:Javascript開発者認定の読み物
Magento がMagento2のJavaScript認定試験を発表 しました。 このページを読んだ後: https://u.magento.com/magento-2-certified-professional-javascript-developer このJavaScript開発者認定試験について質問があります。 Javaスクリプト認定試験の準備に役立つ学習教材はどれですか。 このJavaスクリプト認定試験の合格点はいくつですか? この試験に利用できる他の教材はありますか? この試験の再受験ポリシーを教えてください。

4
「section-config.js」でのMagento 2ストアスイッチャーエラーUncaught TypeError:undefined(…)のプロパティ「*」を読み取れません
カスタムテーマにカスタムストアスイッチャーを実装しています。 ブロックテンプレートは次のとおりです。 &lt;?php if (count($block-&gt;getStores())&gt;1): ?&gt; &lt;?php $id = $block-&gt;getIdModifier() ? '-' . $block-&gt;getIdModifier() : ''?&gt; &lt;span&gt;&lt;?php echo $block-&gt;escapeHtml($block-&gt;getStoreName()) ?&gt;&lt;/span&gt; &lt;span&gt;/&lt;/span&gt; &lt;?php foreach ($block-&gt;getStores() as $_lang): ?&gt; &lt;?php if ($_lang-&gt;getId() != $block-&gt;getCurrentStoreId()): ?&gt; &lt;span class="view-&lt;?php echo $block-&gt;escapeHtml($_lang-&gt;getCode()); ?&gt; switcher-option"&gt; &lt;a href="#" data-post='&lt;?php /* @escapeNotVerified */ echo $block-&gt;getTargetStorePostData($_lang); ?&gt;'&gt; &lt;?php echo …

1
UIコンポーネント間でKnockout JSオブザーバブルを共有する方法
次のようなUIコンポーネントプロパティの使用方法imports: {}とexports: {}共有方法を理解しています。 defaults: { exports: { shouldShowMessage: '${$.component}' } } エクスポートでコンポーネント名を返します。 しかし、Knockoutオブザーバブルをエクスポートしようとすると、常に未定義になります。 defaults: { exports: { shouldShowMessage: '${$.shouldShowMessage}' } } ... setupKoBindings: function() { this.shouldShowMessage = ko.observable('Testing'); } 回避策として、ここで説明するようにストレージモデルを作成しますが、インポートとエクスポートを使用したいと思います。


弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.