Создать массив переменных JS с помощью набора данных из HTML-вариации woocommerce - PullRequest
Новая
       32

Создать массив переменных JS с помощью набора данных из HTML-вариации woocommerce

1 голос
/ 22 октября 2019

Это часть ванильного кода JS = 

var prices = [100, 536, 2368];

Но все вышеперечисленное жестко закодировано. Я хочу их через выпадающий список HTML: 

<select class="license_type" name="license_type" id="license_type">
    <option value="license" data-price="500">Single Site License</option>
    <option value="license" data-price="700">5 Site License</option>
    <option value="license" data-price="1400">Developers License</option>
</select>

Здесь значения в наборе данных генерируются динамически в woocommerce:

enter image description here

Значения наборов данных будут генерироваться динамически на основе продукта woocommerce.

Как мы можем быть уверены, что массив var prices всегда обновляется динамически на каждой странице продукта на основе переменных цен?

Обновление →

Существует ответ на этот вопрос, здесь ответили → Тег опции раскрывающегося списка вариантов Woocommerce добавить некоторый набор данных

(Этокак мы вводим набор данных в HTML тега options)

Наконец, в браузере он будет выглядеть так:

enter image description here

1 Ответ

1 голос
/ 22 октября 2019 
    add_action( 'wp_footer', 'webtoffee_product_attr_filter' );

    function webtoffee_product_attr_filter() {
       if ( !is_product() ) {
          return;
       }
       ?>
          add_action('wp_footer', 'webtoffee_checkout_shipping_filter_it_states');

    function webtoffee_checkout_shipping_filter_it_states() {
        if (!is_product()) {
            return;
        }
        ?>

       <script>

        var x = document.getElementById("color");
        var prices = new Array();;
        var i;
        for (i = 0; i < x.length; i++) {
            if(x.options[i].getAttribute('data-custom')){
            prices.push(x.options[i].getAttribute('data-custom'));
        }else{
            prices.push("0");
        }
        };
        console.log(prices);
        </script>

    <?php
}

Попробуйте это

...