Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.91/11: Рейтинг темы: голосов - 11, средняя оценка - 4.91
225 / 216 / 89
Регистрация: 12.09.2015
Сообщений: 986

Изменение display при изменении value у input

28.03.2016, 16:45. Показов 2329. Ответов 6
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Всем привет, есть примерное следующий код:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<div data-uniqid="56f685a07f57a5.13112283" data-logic="" data-haslogic="" class="cpf_hide_element cell col-12 cpf-type-range">
  <label class="tm-epo-field-label">Моцарелла</label>
  <div class="tm-extra-product-options-container">
    <ul data-rules="[[&quot;90&quot;]]" data-rulestype="[[&quot;step&quot;]]" data-tm-validation="{&quot;max&quot;:3}" class="tmcp-ul-wrap tmcp-elements tm-extra-product-options-range tm-element-ul-range element_3">
      <li class="tmcp-field-wrap">
        <div class="tm-range-picker noUi-target noUi-ltr noUi-horizontal noUi-connect" data-min="0" data-max="3" data-step="1" data-pips="" data-show-picker-value="" data-field-id="tmcp_range_9" data-start="">
          <div class="noUi-base">
            <div class="noUi-origin noUi-background" style="left: 0%;">
              <div class="noUi-handle noUi-handle-lower" title=""></div>
            </div>
          </div>
        </div>
        <label class="tm-show-picker-value" for="tmcp_range_9"></label>
        <input class="tmcp-field tm-epo-field tmcp-textfield tmcp-range" name="tmcp_range_3" data-price="" data-rules="[[&quot;90&quot;]]" data-rulestype="[[&quot;step&quot;]]" value="0" id="tmcp_range_9" tabindex="9" type="hidden">
        <span class="amount  hidden">0&nbsp;</span>
      </li>
    </ul>
  </div>
</div>
//...
<img id="someid" src="image.png" style="display:none">
Это ползунок, т.е. пользователь просто перетягивает ползунок и у input меняется значение value от 0 до 3. Нужно как-то сделать, чтобы при значении value отличном от 0 менялось значение display (с none на block) у изображения.
И ещё вопрос, можно ли считывать значение у input находя его не по его id а по содержимому первого label (там где моцарелла)?
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
28.03.2016, 16:45
Ответы с готовыми решениями:

Изменение значение value при изменении текста в input
Собственно вопрос весь в названии. Есть &lt;input name=&quot;tel&quot; val=&quot;&quot;&gt; При фокусировке на поле, или просто при вставке телефона, нужно,...

come Display This video mode change computer display input to 1240 x .... 60hz
Здравствуйте, у моего знакомого полетел компьютер,пожалуйста помогите его вернуть к жизни,очень прошу. Значит:У друзей, Один знакомый...

Cannot display this video mode,change computer display input to 1024x768 60 HZ
Компьютер стабильно работал,и внезапно появился черный экран на котором написано &quot;Cannot display this video mode,change computer...

6
 Аватар для AmateR62
118 / 118 / 87
Регистрация: 24.02.2014
Сообщений: 404
28.03.2016, 20:26
А где сам скрипт? На такую постановку вопроса можно ответить так: когда в скрипте пишется значение в input меняем стиль изображения:
JavaScript
1
$('#someid').css('display', 'none');
Цитата Сообщение от Анар Посмотреть сообщение
можно ли считывать значение у input находя его не по его id а по содержимому первого label
JavaScript
1
var a = $('.tm-epo-field-label').next('div').find('input').val();
0
225 / 216 / 89
Регистрация: 12.09.2015
Сообщений: 986
28.03.2016, 23:01  [ТС]
AmateR62, скрипты где-то в директории плагина, прикреплю к сообщению. Работают эти ползунки на noUi.

Принцип работы я отдалёно понял. Считывать value у input не получается, т.к. он не меняется, из-за noUi. При движении ползунка меняется значение title у div'а на 9й строке и цена в спане на 15. Вопрос в следующем, как через них можно менять значение display?
У самого до js руки так и не дошли, его я не понимаю вообще, накалялкал примерно следующее:
JavaScript
1
2
3
4
5
6
7
8
jQuery(document).ready(function($){
    $(".noUi-handle").change(function(){
    var value = $('[name="Моцарелла"]').next('div').find(".noUi-handle").attr('title');
    if(value > 0) {
    alert(value);
}
});
});
Что естественно не работает...
Вложения
Тип файла: 7z tp.7z (54.0 Кб, 1 просмотров)
0
 Аватар для AmateR62
118 / 118 / 87
Регистрация: 24.02.2014
Сообщений: 404
29.03.2016, 08:39
Цитата Сообщение от Анар Посмотреть сообщение
Работают эти ползунки на noUi
Так у слайдера есть события (почитать), надо привязываться к ним, а не к значениям в title какого то input.

JavaScript
1
2
3
slider.noUiSlider.on('update', function(){
  /* код изменения видимости */
});
У вас на какой элемент слайдер вешается?
0
225 / 216 / 89
Регистрация: 12.09.2015
Сообщений: 986
29.03.2016, 14:06  [ТС]
AmateR62, если бы я знал как это сделать...
Ну видимо на input вешается.

Если поможет, то вот ссылка на страницу.
0
 Аватар для AmateR62
118 / 118 / 87
Регистрация: 24.02.2014
Сообщений: 404
29.03.2016, 14:30
Анар, а где он у вас инициализируется в коде? Или он как вордпрессовский плагин подключен?
0
225 / 216 / 89
Регистрация: 12.09.2015
Сообщений: 986
30.03.2016, 02:05  [ТС]
AmateR62, как WP-плагин.

Добавлено через 11 часов 8 минут
AmateR62, в общем немного переделал. Отправлю в ад ползунки и сделаю через чекбоксы, как у соусов. Сделал примерно вот так:
JavaScript
1
2
3
4
5
6
7
8
9
jQuery(document).ready(function($){
    var elem = $('label:contains("Томатный")').prev('input');
    elem.change(function(){
    var value = elem.prop("checked");
    if(value == true){
        alert('...');
    }
});
});
Вроде работает. Но вот проблема, т.к. цены на одни и те же ингредиенты при разных диаметрах разные, то плагином этот момент можно сделать только через условную логику, т.е. всех элементов на странице по два. При диаметре 30см одни на странице отображаются другие помечены display:none, соответственно при смене диаметра всё меняется.
Код работает при нажатии на "Томатный" при 30см, но если поменять диаметр, то при нажатии на "Томатный" (уже 2й) ничего не происходит. Я примерно понимаю, что это, скорее всего, из-за того, что prop() берёт значение только у первого, но функции map(), each() я не понял. Можете подсказать, как правильно это написать?

И ещё вопрос, есть ли аналог :contains, но не чувствительный к регистру?
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
30.03.2016, 02:05
Помогаю со студенческими работами здесь

Как исправить ошибку cannot display this video mode change computer display input 1280*1024@60hz
Привет!!!Помогите пожалуста!!!!!!!!! Стала изменять расширение экрана, изменила,компьютер попросил перезагрузки,перезагрузившись,он...

Изменение цвета поля Input при наборе текста (именно при наборе,а не при установке курсора мышки в поле Input)
Добрый день всем! Подскажите пожалуйста код, позволяющий сделать следующие действия. Есть поле Input и в нем необходимо сделать так,...

Изменение ObservableCollection: автоматическое изменение свойства при изменении в DataGrid
Здравствуйте. Имеется коллекция на 35 параметров. Значения 2 главных параметров складываются из определенных сумм остальных. Вывожу...

Изменять value при изменении input поля
Обычный input &lt;input type=&quot;text&quot; value=&quot;123&quot;/&gt; Цель: Нажали backspace value сразу изменилось &lt;input type=&quot;text&quot;...

Выполнение действия при изменении нескольких input
Есть четыре &lt;input id=&quot;1&quot; type=&quot;file&quot;&gt; &lt;input id=&quot;2&quot; type=&quot;file&quot;&gt; &lt;input id=&quot;3&quot; type=&quot;file&quot;&gt; &lt;input id=&quot;4&quot; type=&quot;file&quot;&gt; ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Новые блоги и статьи
Первый деплой
lagorue 16.01.2026
Не спеша развернул своё 1ое приложение в kubernetes. А дальше мне интересно создать 1фронтэнд приложения и 2 бэкэнд приложения развернуть 2 деплоя в кубере получится 2 сервиса и что-бы они. . .
Расчёт переходных процессов в цепи постоянного тока
igorrr37 16.01.2026
/ * Дана цепь постоянного тока с R, L, C, k(ключ), U, E, J. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа, решает её и находит токи на L и напряжения на C в установ. режимах до и. . .
Восстановить юзерскрипты Greasemonkey из бэкапа браузера
damix 15.01.2026
Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .
Изучаю kubernetes
lagorue 13.01.2026
А пригодятся-ли мне знания kubernetes в России?
Сукцессия микоризы: основная теория в виде двух уравнений.
anaschu 11.01.2026
https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/
WordPad для Windows 11
Jel 10.01.2026
WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11
Jel 10.01.2026
Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
Почему дизайн решает?
Neotwalker 09.01.2026
В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru