0

我在我的网站上使用 .change() 函数单击此处,它使用户能够选择其产品的数量。我遇到的问题是我的图表只是将我的我链接到 12 包而不是 6 包。我检查了萤火虫,我注意到 JS 创建了两个按钮,我相信链接到 6 包的按钮开始与 12 包的按钮重叠。

最终,我希望按钮链接相对于价格发生变化。有谁知道我需要在下面添加我的代码来实现这一点?

我只有一个链接按钮,我正在使用表达式引擎,所以第二个是自动创建的

<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

我将只有一个,而不是在您的页面中有两个链接按钮。然后,当索引更改时,我会更新该链接按钮的 href 属性。

于 2012-10-03T23:06:27.950 回答
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 回答
0

这变成了一个非常丑陋的 hack,代码未经测试,但我认为它应该可以工作。

请试一试,如果您有任何问题,请告诉我:

<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 回答