welcart 数量入力フィールドの前後に+/-のボタンを設置する

Filed under: JavaScript,welcart — kdcs @ 19年12月6日 金曜日

welcartの商品詳細ページにある商品購入用フォームの数量をプラス+と-ボタンで入力できるようにする。
※jQueryを使用するので先にjQeryが読み込まれている必要あり

2019年12月14日現在 footer.php内に記述

<?php if(is_single()): ?>
<script type="text/javascript">
jQuery(function($){
    $(".skuquantity").after('<input type="button" value="+" id="add1" class="plus" />').before('<input type="button" value="-" id="minus1" class="minus" />');
    $(".plus").click(function(){
        var currentVal = parseInt(jQuery(this).prev(".skuquantity").val());
        if (!currentVal || currentVal=="" || currentVal == "NaN") currentVal = 0;
        $(this).prev(".skuquantity").val(currentVal + 1);
    });
    $(".minus").click(function(){
        var currentVal = parseInt(jQuery(this).next(".skuquantity").val());
        if (currentVal == "NaN") currentVal = 0;
        if (currentVal > 0) {
            $(this).next(".skuquantity").val(currentVal - 1);
        }
    });
});
</script>
<?php endif; ?>

サイト内検索

カテゴリー

最近の投稿

« |welcart 数量入力フィールドの前後に+/-のボタンを設置する| »
↑上に戻る