• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Как можно управлять позиционированием элементов формы после ее загрузки?

Image CMS

vasja

Опытный
#1
Всем привет. есть магазин с вариативными товарами. подскажите, как можно управлять позиционированием элементов формы (с атрибутами товаров различных вариаций для вывода) после ее загрузки? условие скриптов не выполняется..
 

searchingman

Гуру
Местный
#2
Позиционированием элементов управляют с помощью стилей.
Динамически изменять стили можно с помощью JavaScript-а.
 

vasja

Опытный
#3
Позиционированием элементов управляют с помощью стилей.
Динамически изменять стили можно с помощью JavaScript-а.
searchingman вы не внимательны - я писал: "условие скриптов не выполняется.." = динамически стили менять не удается, из-за того, что все атрибуты для тегов прописываются в параметрах формы. вот и спрашиваю - как их оттуда извлечь и далее с ними взаимодействовать?
 

searchingman

Гуру
Местный
#4
searchingman вы не внимательны - я писал: "условие скриптов не выполняется.." = динамически стили менять не удается, из-за того, что все атрибуты для тегов прописываются в параметрах формы. вот и спрашиваю - как их оттуда извлечь и далее с ними взаимодействовать?
Какие условия?
Приводите код условий JavaScript и давайте ссылку на страницу с вашим скриптом.
 

vasja

Опытный
#5
Какие условия?
Приводите код условий JavaScript и давайте ссылку на страницу с вашим скриптом.
Есть в интернет-магазине форма, которая устанавливает стоимость товара в зависимости от выбранных пользователем атрибутов. Мне нужно обратиться к блоку с классом price и поменять его месторасположение (в зависимости от условия). Проблема в том, что если смотреть через консоль, то видно, что <span class="price"><span class="amount">260.000&nbsp;руб.</span> формируется через атрибут data-product_variations самой формы, т.е. блок, в котором он формируется <div class="single_variation"></div> - пустой, а если смотреть html-код страницы, то он там есть. Вопрос: как обратиться мне к блоку с классом .price, чтобы в дальнейшем с ним манипулировать? Как вы могли заметить - такой строчкой $this.find('.price') этого не получается сделать.

HTML:
<!-- То, что видно в скрипте через консоль-->
<div class="product-frame">
  <form class="variations_form cart" method="post" enctype="multipart/form-data" data-product_id="3351" data-product_variations="[{&quot;variation_id&quot;:3354,&quot;variation_is_visible&quot;:true,&quot;variation_is_active&quot;:true,&quot;is_purchasable&quot;:true,&quot;display_price&quot;:260000,&quot;display_regular_price&quot;:260000,&quot;attributes&quot;:{&quot;attribute_pa_size&quot;:&quot;large&quot;},&quot;image_src&quot;:&quot;&quot;,&quot;image_link&quot;:&quot;&quot;,&quot;image_title&quot;:&quot;&quot;,&quot;image_alt&quot;:&quot;&quot;,&quot;price_html&quot;:&quot;<span class=\&quot;price\&quot;><span class=\&quot;amount\&quot;>260.000&nbsp;руб.<\/span><\/span>&quot;,&quot;availability_html&quot;:&quot;&quot;,&quot;sku&quot;:&quot;PS101-1&quot;,&quot;weight&quot;:&quot; kg&quot;,&quot;dimensions&quot;:&quot;&quot;,&quot;min_qty&quot;:1,&quot;max_qty&quot;:&quot;&quot;,&quot;backorders_allowed&quot;:false,&quot;is_in_stock&quot;:true,&quot;is_downloadable&quot;:false,&quot;is_virtual&quot;:false,&quot;is_sold_individually&quot;:&quot;no&quot;},{&quot;variation_id&quot;:3355,&quot;variation_is_visible&quot;:true,&quot;variation_is_active&quot;:true,&quot;is_purchasable&quot;:true,&quot;display_price&quot;:160000,&quot;display_regular_price&quot;:160000,&quot;attributes&quot;:{&quot;attribute_pa_size&quot;:&quot;medium&quot;},&quot;image_src&quot;:&quot;&quot;,&quot;image_link&quot;:&quot;&quot;,&quot;image_title&quot;:&quot;&quot;,&quot;image_alt&quot;:&quot;&quot;,&quot;price_html&quot;:&quot;<span class=\&quot;price\&quot;><span class=\&quot;amount\&quot;>160.000&nbsp;руб.<\/span><\/span>&quot;,&quot;availability_html&quot;:&quot;&quot;,&quot;sku&quot;:&quot;PS101-2&quot;,&quot;weight&quot;:&quot; kg&quot;,&quot;dimensions&quot;:&quot;&quot;,&quot;min_qty&quot;:1,&quot;max_qty&quot;:&quot;&quot;,&quot;backorders_allowed&quot;:false,&quot;is_in_stock&quot;:true,&quot;is_downloadable&quot;:false,&quot;is_virtual&quot;:false,&quot;is_sold_individually&quot;:&quot;no&quot;},{&quot;variation_id&quot;:3356,&quot;variation_is_visible&quot;:true,&quot;variation_is_active&quot;:true,&quot;is_purchasable&quot;:true,&quot;display_price&quot;:80000,&quot;display_regular_price&quot;:80000,&quot;attributes&quot;:{&quot;attribute_pa_size&quot;:&quot;small&quot;},&quot;image_src&quot;:&quot;&quot;,&quot;image_link&quot;:&quot;&quot;,&quot;image_title&quot;:&quot;&quot;,&quot;image_alt&quot;:&quot;&quot;,&quot;price_html&quot;:&quot;<span class=\&quot;price\&quot;><span class=\&quot;amount\&quot;>80.000&nbsp;руб.<\/span><\/span>&quot;,&quot;availability_html&quot;:&quot;&quot;,&quot;sku&quot;:&quot;PS101-3&quot;,&quot;weight&quot;:&quot; kg&quot;,&quot;dimensions&quot;:&quot;&quot;,&quot;min_qty&quot;:1,&quot;max_qty&quot;:&quot;&quot;,&quot;backorders_allowed&quot;:false,&quot;is_in_stock&quot;:true,&quot;is_downloadable&quot;:false,&quot;is_virtual&quot;:false,&quot;is_sold_individually&quot;:&quot;no&quot;}]">

    <div class="single_variation"></div>
  </form>
</div>
<!-- Итог -->
<div class="product-frame">
  <form class="variations_form cart" method="post" enctype="multipart/form-data" data-product_id="3351" data-product_variations="..">
    <div class="single_variation"><span class="price"><span class="amount">260.000&nbsp;руб.</span></span>
    </div>
</div>
</form>
Код:
$('.product-frame').each(function() {
      var $this = $(this);
      var variations_form = $this.find('.variations_form');
      console.log(variations_form.html());
      $this.find('.price').css("top", (height + 32) + "px");
    }
    });
Код:
.product-frame {
  position: relative;
}
.product-frame .price {
  position: absolute;
  top: 379px;
  left: 10px;
}
 

searchingman

Гуру
Местный
#6
Как можно подсказать без отладчика в браузере?
Возможно у Вас скрипты конфликтуют между собой или стили из других файлов перекрывают друг друга?
Или еще +100500 других причин.

Вот поэтому просят ссылку на "проблемную" страницу, чтобы было от чего-то оттолкнуться.

Поэтому или давайте ссылку или жмите <F12> в браузере и отлаживайте сами свой код. ;)
 

vasja

Опытный
#7
Как можно подсказать без отладчика в браузере?
Возможно у Вас скрипты конфликтуют между собой или стили из других файлов перекрывают друг друга?
Или еще +100500 других причин.

Вот поэтому просят ссылку на "проблемную" страницу, чтобы было от чего-то оттолкнуться.

Поэтому или давайте ссылку или жмите <F12> в браузере и отлаживайте сами свой код. ;)
ответил в лс
 
Сверху Снизу