1

私はPHPが初めてで、特定の機能をコーディングする方法を理解しようとしています。写真を表示する製品ページがあり、サイズ用と色用の 2 つのドロップダウン メニューがあります。私がやりたいことは、ページが最初に読み込まれるときに、デフォルトの製品 SKU を持つ変数を設定することです。メニューが変更されたら、選択した 2 つのメニュー項目を組み合わせた値に変数を変更したいと考えています。変数が変更されると、これを写真と非表示のフォーム値 (最終的にカートに送信するため) に反映させたいと考えています。

そのため、ページが読み込まれると、サイズと色のドロップダウンに関連する値とともに画像 A が表示されます。次に、ドロップダウンのいずれかが変更されると、写真が動的に変更されて反映されます (非表示のフォーム値も更新されます)。

どんな提案でも大歓迎です。

4

2 に答える 2

3

ここで必要なのは、JavaScript、または jQuery のような JS ライブラリです。

jQuery の場合 (推奨、より簡単):

var $select = $('#Dropdown'),
    $img = $('#Picture');

$select.on('change',function(){
    $img.attr('src',$(this).val());
});

JavaScript の場合:

var dropdown = document.getElementById('Dropdown'),
    img = document.getElementById('Picture');

dropdown.addEventListenter('change',function(){
    img.src = this.value;
});

テストされていませんが、動作するはずです。

編集: JavaScript ソリューションを使用する場合は、ウィンドウが最初に読み込まれることを確認してください (要素がまだ存在しない場合は機能しません)。

window.onload = function(){
    // do your magic here
}
于 2013-01-28T19:31:05.737 に答える
2

まず、PHPはサーバー側の言語です。つまり、PHPが生成するものはすべてサーバーで処理され、ブラウザーに返送される必要があります。したがって、この特定のケースでは、Javascriptなどのクライアント側言語を使用するか、コードを簡単にするためにjQueryなどのライブラリを使用する必要があります。

jQueryの詳細については、以下を参照してください。

http://jquery.com/

非常に一般的な用語で(コードを投稿していないため)、jQueryを使用して画像を変更する例を次に示します。

// Select the dropdown from the DOM
var dropdown = $('#dropdown_id');

// Select the image from the DOM
var image = $('#image');

// Set the onchange event
// This will be fired when the select value is changed
dropdown.on('change',function(){
    // Get the value of the selected option
    var value = $(this).val();

    // Change the source of the image
    image.attr('src',value);
});
于 2013-01-28T19:40:59.820 に答える