0

私は自分のサイトで .change() 関数を使用しています ここをクリックして、ユーザーが製品の数量を選択できるようにします。私が抱えている問題は、チャートが私の私を 12 パックのみにリンクしており、6 パックにはリンクしていないことです。firebug をチェックインしたところ、JS が 2 つのボタンを作成していることに気付きました。6 パックにリンクするボタンが 12 パックのボタンと重なっていると思います。

最終的には、価格に応じてボタンのリンクを変更したいと考えています。これを達成するために以下のコードを追加する必要があることを誰かが知っていますか?

リンク ボタンは 1 つしかありません。式エンジンを使用しているため、2 つ目は自動的に作成されます。

<script type="text/javascript">
var message = new Array();
message[1] = "$15.00";
message[2] = "$25.00";
$(document).ready(function(){            
$("#item_select").change(function()
 {
  var message_index
  message_index = $("#item_select").val();
   $(".price-item h3").empty();
    if (message_index > 0)
    $(".price-item h3").append(message[message_index]);
  });
 });
 </script>


{p_cartlink}
 <a href="http:// class="button_atc atc_{url_title}"></a>
 {/p_cartlink}

問題は、このコードがテンプレート用であるSLEEP-12 and SLEEP-6ため、製品 ID を使用するために必要な製品名が必要ないことです。これは、JS で各ボタンのニーズ ID を作成し、ボタンを有効または無効にする方法です。たとえば、6 パックを選択すると 6 パック ボタンが表示され、12 パックは無効になりますか?

4

4 に答える 4

2

あなたはこのようにすることができます

$(document).ready(function() {
    $("#item_select").change(function() {
        var message_index
        message_index = $("#item_select").val();
        // get the correct button
        var $button = $('.price-item right .button_atc').eq(message_index-1);
        // hide button - not the correct one
        $('.price-item right .button_atc').not($button).hide();
        // show correct button
        $button.show();
        $(".price-item h3").empty();
        if (message_index > 0) $(".price-item h3").append(message[message_index]);
    });
});​
于 2012-10-03T23:13:19.763 に答える
0

あなたのページに2つのリンクボタンを置く代わりに、私は1つだけ持っているでしょう。次に、インデックスが変更されたら、そのリンクボタンのhrefプロパティを更新します。

于 2012-10-03T23:06:27.950 に答える
0

これは非常に醜いハックになり、コードはテストされていませんが、動作するはずです。

試してみて、問題がある場合はお知らせください。

<script type="text/javascript">
var message = ["$15.00","$25.00"];
$(document).ready(function(){
    // Init to make sure we display the correct button @ load
    $("#item_select").trigger('change');

    // The change-function
    $("#item_select").on('change'.function() {
        var message_index = $("#item_select").val();
        var message_indexn = message_index.split(' ');
        var message_id = 0;
        for ($i = 0; i < message_indexn.length; i++) {
            if (/^[\d]+$/.test(message_indexn[i])) {
                message_id = message_indexn[i];
                break;
            }
        }

        $(".price-item h3").empty();
        if (message_index > 0)
            $(".price-item h3").append(message[message_index-1]);

        $('.price-item .button_atc').each(function () {
            if ($(this).attr('href') == 'http://store.bodyworksforme.com/ShoppingCart.asp?ProductCode=SLEEP-'+message_id) {
                if ($(this).is(':hidden'))
                    $(this).show();
            }
            else {
                if ($(this).is(':visible'))
                    $(this).hide();
            }
        });
    });
});
 </script>
于 2012-10-03T23:18:18.807 に答える
0

これは機能しますか？

<select id="item_select">
    <option value="6">6 pack</option>
    <option value="12">12 pack</option>
</select>

$('.button_atc').bind('click',function(){
var val = $('#item_select').val();
window.location = "store.bodyworksforme.com/ShoppingCart.asp?ProductCode=SLEEP"+val;
});

必要に応じて、ボタンの ID を設定して、製品に固有のものにすることもできます。

于 2012-10-04T18:25:57.227 に答える