spinastr,
вы меня уже так достали своей простотой, просто слов нет. То есть по вашему то что на картинке тоже самое что и код здесь? Вы вникаете в то, что вам пишут? |
laimas,
Всё исправил, дальше что делать? |
Всё осталось как было
{"date":"23.2.2018","rate":{"USD":{"value":56.7608,"dyn":2},"EUR":{"value":69.6341,"dyn":1}},"previous":null,"current":{"date":"23.2.2018"}} |
Вот файлы, думаю заменить ими те что на сервере не сложно будет, и разбирайтесь дальше сами.
Закомментированный код в current.php удалить. |
laimas,
Спасибо, всё добавил а тут даже дата не выводится <script> $.getJSON("http://h116641.s08.test-hf.su/", function(data) { $('.previous date').html(data.current.date); $('.current date').html(data.previous.date); $.each(data, function(k, o) { $.each(o, function(a, r) { $('.'+k+'.'+a).html( a=='date' ? r : {'USD':'$','EUR':'€'}[a] + ' ' + r.value.toFixed(2) + ' <b class=' + ['','down','up'][r.rate] +'>' + ['','▼','▲'][r.rate] +'</b>' ).attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' }) }) }) //}); </script> на тесте всё пусто http://h116641.s08.test-hf.su/test.html |
spinastr,
все, я больше ни слова не скажу. Хрен знает чего вы делаете, а все что я дал, это рабочее. Кроме этой хрени $('.previous date').html(data.current.date); $('.current date').html(data.previous.date); которая как собаке пятая лапа, но это не мое. |
Цитата:
<html lang="ru"> <head> <meta charset="utf-8" /> <title>Документ без названия</title> <script type="text/javascript" src="http://forum.ucoz.ru/.s/src/jquery-1.7.2.js"></script> </head> <body> <style> .up {color: #0f0;} .down {color: #f00;} </style> <table> <tr> <td><span class="previous date"></span></td> <td><span class="current date"></span></td> </tr> <tr> <td><span class="previous USD title"></span></td> <td><span class="current USD title"></span></td> </tr> <tr> <td><span class="previous EUR"></span></td> <td><span class="current EUR"></span></td> </tr> </table> <p style="font-size: 2em;" class="previous USD title"></p> <p style="font-size: 1.5em;" class="current EUR"></p> <p style="font-size: 2em;" class="current USD title"></p> <script> $.getJSON("http://h116641.s08.test-hf.su/", function(data) { $.each(data, function(k, o) { $.each(o, function(a, r) { $('.'+k+'.'+a).html( a=='date' ? r : {'USD':'$','EUR':'€'}[a] + ' ' + r.value.toFixed(2) + ' <b class=' + ['','down','up'][r.rate] +'>' + ['','▼','▲'][r.rate] +'</b>' ).attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' }) }) }) //}); </script> </body> </html> Как выводить то? |
spinastr,
если не можете увидеть ошибку в скрипте,то в консоль смотрите. где заканчивается функция function(data) {...} ? |
|
нет не пусто! Красная строка не в счет? А в правой части этой строки ссылка на строчку в коде, где эта ошибка
|
|
spinastr,
куда поместить курсы и дату из полученного ответа определяется ключами самого объекта. А для этого имена ключей дают элементам на странице как имена классов. <span class="previous date"></span> - это составное имя класса, и к этому элементу можно обратиться по любому из имени класса (как селектору). Если же обращаться по двум именам, то их пишут через точку - previous.date. Полученный объект (курсы) обходят двумя циклами, в первом $.each(data, function(k, o) значением аргумента "k" будут первичные ключи объекта, то есть "current" и "previous", а аргумент "о" принимает объекты с датой и курсами валют. Второй цикл $.each(o, function(a, r) - обходит курсы и его аргументами будут: "a" - ключи "date", "USD", "EUR", а "r" будет иметь значения этих ключей, то есть даты и курсов. Метод $('.'+k+'.'+a) соединяя первичные ключи объекта со вторичными формирует селектор составного имени класса, и они будут равны: .current.date .current.USD .current.EUR .previous.date .previous.USD .previous.EUR и jQuery по этим селекторам выбирает элементы на странице. Я и показал в примере и таблицу, и параграфы, а можно было всю страницу заклеить элементами с классами, в которые jQ и поместит данные. .html() - метод который помещает сами данные плюс стрелки. .attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' }) - этот метод добавит и дату в title значение элемента, если у элемента есть имя класса title. Поэтому у <span class="previous USD title"></span> будет подсказка с датой, а у <span class="previous EUR"></span> нет. Вот и вся работа на клиенте. Все до безобразия просто. А ошибки если есть, так с ними надо разбираться, хрен знает что у вас там творится. А гаданием ни кто заниматься не станет. |
эта ошибка говорит о том, что у вас где-то не закрыты скобки. Проверяйте, для каждой ли открытой скобки есть закрывающая.
Если вы пользуетесь каким-либо редактором (например notepade++), они обычно подсвечивают пары скобок. |
Цитата:
Вы у этой строки $.getJSON("http://h116641.s08.test-hf.su/", function(data) { его убрали, а из этой //}); нет, и тело функции не закрыто! Когда же вы изучать матчасть начнете. |
Это нужно поместить перед "</body>":
$(function(){ $.getJSON('http://h116641.s08.test-hf.su/',function(data){ $('[data-currency]').each(function(){ var currency=this.dataset.currency.toUpperCase(), type=this.dataset.currencryType.toLowerCase()||'current', prefix=this.dataset.currencryPrifex||''; if(!data[type] || !data[type][currency]) return; var item=data[type][currency], html=(prefix?prefix.trim()+' ':'')+item.value.toFixed(2)+' '+ '<b class="'+['down','up'][item.rate-1]+'">'+ ['▼','▲'][item.rate-1]+ '</b>'; $(this).html(html); }); }); }); Так можно вывести курсы: <div data-currency="usd" data-currency-type="current" data-currency-prefix="$">Тут будет курс доллара на сегодня</div> <div data-currency="usd" data-currency-type="previous" data-currency-prefix="$">Тут будет курс доллара на вчера</div> <div data-currency="eur" data-currency-type="current" data-currency-prefix="€">Тут будет курс евро на сегодня</div> <div data-currency="eur" data-currency-type="previous" data-currency-prefix="€">Тут будет курс евро на вчера</div> Доллар вчера стоил <span data-currency="usd" data-currency-type="previous"></span> рублей, а евро <span data-currency="eur" data-currency-type="previous"></span> Если я нигде не ошибся, то будет работать. |
Nexus,
зачем? Ему код простого автомата дали, а вы наворотили еще кучу, чтобы он вообще запутался? И зачем такие сложности городить? |
Я очень ценю всё что выше написано, это труд что бы мне объяснить.
Спасибо ВАМ, но как вы мне объясняете и я не понимаю! Так и я объясняю, что не понимаю... На той неделе сделали курс доллара, я немного что то запомнил, потом подумал про евро, прошло 5 дней и я уже забыл подробности js. Вы в этой среде обитаете и шарите в этом и вам кажется что и другие с лёгкостью поймут. У меня нету даже базового знания js Я методом народного тыка 5 лет учил HTML и CSS- мне ни кто не помогал, а когда говорили я не понимал. Так и тут я понял 37% Буду сейчас подставлять снова методом народного тыка и задовать вопросы в форум. До этого все скрипты были написано, спасибо за это и снова как неделю назад, осталось вывести из json в html и я не понимаю. Даже если и пойму, забуду через неделю. Почему нельзя сразу всё подсказать, можно казать 97% сделано, конечно не мной мне помогли, видите как мне тяжело даются оставшиеся 3 %? Например я разбираюсь в сочетании цветов и легко могу что то подобрать, а другой в этом не понимает. Лучше сразу подсказать чем учить и смотреть как человек мучается. |
Nexus,
поместил на тестовой странице пусто |
Цитата:
JS-код вы вставили, отлично, но что на счет вывода информации? Читайте то, что ниже этого: Цитата:
|
laimas, таки да, тут я затупил, тс не справился со столь "сложным" выводом информации...
|
Цитата:
Эта тема может быть занесена в книгу рекордов Гиннеса как самая толстая тема на форму программистов. И большая заслуга в этом принадлежит вам, причиной которой является банальная невнимательность, которую ни к JS ни к любому иному языку не пришить. По меньше бы писали лишнего и больше бы вникали что вам пишут, ибо вы одно просите, затем иное, вам под иное пишут код, а вопрошающий уже и сам запутался что где и чего надо. Цитата:
И большая масса постов этой темы именно в этом ключе - "что-то мычат, не понятно о чем", и при этом ждут конкретного ответа. Чего же вы ожидаете в таком случае? И не думайте, что это я написал сжатыми в кулак руками, это действительно такая тема, пустая на 99%. ************ Начитайте изучать предмет, ибо тут не кафедра Javascript, а форум помощи тем кто сам что-то делает. Иначе как со стеной диалог получается. |
Цитата:
Что охота продолжение темы до 1000 постов? |
laimas, мне (не)показалось, что у автора возникают какие-то сложности с присвоением классов для вывода информации, подумал, может быть ему будет проще присваивать data-атрибуты )
Цитата:
Если автор захочет вывести еще какие-нибудь, то не исключено, что комментариев в теме будет за тысячу. Для вывода курсов для двух валют понадобилось уже около 500 комментариев :lol: |
Цитата:
|
Цитата:
|
Цитата:
Смеётесь на домной? Смейтесь... Я уже точно ничего не понимаю, Если есть желание подсказать то подскажите, если нет. То верну скрипт как был, просто с выводом одного курса доллара. Лично я лучше учусь на живом примере который готов и работает, а подставлять всё по очереди то JS это сложнее CSS И HTML, Прошу вас подскажите что делать? |
Код
<html lang="ru"> <head> <meta charset="utf-8" /> <title>Документ без названия</title> <script type="text/javascript" src="http://forum.ucoz.ru/.s/src/jquery-1.7.2.js"></script> </head> <body> <style> .up {color: #0f0;} .down {color: #f00;} </style> <table> <tr> <td><span class="previous date"></span></td> <td><span class="current date"></span></td> </tr> <tr> <td><span class="previous USD title"></span></td> <td><span class="current USD title"></span></td> </tr> <tr> <td><span class="previous EUR"></span></td> <td><span class="current EUR"></span></td> </tr> </table> <p style="font-size: 2em;" class="previous USD title"></p> <p style="font-size: 1.5em;" class="current EUR"></p> <p style="font-size: 2em;" class="current USD title"></p> <script> $.getJSON("http://h116641.s08.test-hf.su/", function(data) { $.each(data, function(k, o) { $.each(o, function(a, r) { $('.'+k+'.'+a).html( a=='date' ? r : {'USD':'$','EUR':'€'}[a] + ' ' + r.value.toFixed(2) + ' <b class=' + ['','down','up'][r.rate] +'>' + ['','▼','▲'][r.rate] +'</b>' ).attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' }) }) }); </script> </body> </html> |
Так не выводится в блок, дата
$('.previous date').html(data.current.date); так не выводится дата $('.previous date').html(current.date); Как выводится дата?:write: |
Цитата:
Классы как селекторы выбраны потому, что позволяют вывести курсы в несколько областей страницы. ID как уникальное значение этого не позволит сделать, хотя если заменить классы на ID и так их писать current-USD .... то можно вывести оба курса за две даты с датами. А если применить селектор [id|=current] то и больше, но вся прелесть ID уже не в счет. Селектор по имени класса плох тем, что будут опрошены все элементы на странице, пусть хоть тысячи, все. Но можно ограничить поиск, если поместить нужные элементы с классами в блоки с уникальными ID и указать поиск только в них. Вот тот же самый пример, в нем для примера таблице дан id и два параграфа помешены в блок с id, только в которых и будет производится поиск нужных элементов. И результат: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta http-equiv="content-type" content="text/html" /> <title>Курс</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> </head> <body> <style> .up {color: #0f0;} .down {color: #f00;} </style> <table id="box_1"> <tr> <td><span class="previous date"></span></td> <td><span class="current date"></span></td> </tr> <tr> <td><span class="previous USD title"></span></td> <td><span class="current USD title"></span></td> </tr> <tr> <td><span class="previous EUR"></span></td> <td><span class="current EUR"></span></td> </tr> </table> <p style="font-size: 1em;" class="previous USD title">А сюда уже не будет вывода курса, этот элемент имеет нужные имена классов, но находится вне элментов box_1 и box_2</p> <div id="box_2"> <p style="font-size: 1.5em;" class="current EUR"></p> <p style="font-size: 2em;" class="current USD title"></p> </div> <script> //это имитация ответа сервера var data = { "current": { "date": "23.2.2018", "USD": { "value": 56.7608, "rate": 2 }, "EUR": { "value": 69.6341, "rate": 1 } }, "previous": { "date": "22.2.2018", "USD": { "value": 56.6537, "rate": 2 }, "EUR": { "value": 69.8087, "rate": 1 } } }; //закомментируем две строки кода для работы примера //$.getJSON("http://h116641.s08.test-hf.su", function(data) { $.each(data, function(k, o) { console.log(k, o) //это для посмотреть в консоли что это значит, затем удалить $.each(o, function(a, r) { console.log(a, r) //это для посмотреть в консоли что это значит, затем удалить //теперь ограничим поиск элементов по классу на странице только в пределах двух блоков с id равными box_1 и box_2 $('#box_1, #box_2').find('.'+k+'.'+a) //найдем в указанных id элементы по составному классу .html( //и поместим в них html код a=='date' //ключ объекта равен date? ? r //да, ключ объекта равен date, значит помещаем в элементы с классами class="previous date" и class="current date" соответствующую дату, //в какой именно какую определяет значение ключа "k" - current/previous : //нет, значение ключа не равно date, а равно USD или EUR {'USD':'$','EUR':'€'}[a] //получаем символ валюты + ' ' + r.value.toFixed(2) + //добавляем к нему курс ' <b class=' + ['','down','up'][r.rate] +'>' + ['','▼','▲'][r.rate] +'</b>' //добавляем стрелку и ее стиль ).attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' //если у элемента есть имя класса title, то пишем ему в атрибут title дату курса }) }) }) //}); </script> </body> </html> |
Цитата:
|
Уважаемые!
До того как я сел в инвалидную коляску я работал в металлургии, полувагонами отправлял металлолом на заводы. Что дороже 3A, 5A, или Б22? |
spinastr,
вы лучше читайте то что вам дают, забудьте о металлургии. Я дал пример, его можно запустить, он работает, дан комментарий как он работает. Обратиться к элементу class="previous date" по составному классу, это означает $(".previous.date") - имена классов соединены через точку! И я кому об этом писал здесь ранее? Кто блин в этом виноват - мы? И нахрена такой хренью заниматься отдельно и явно прописывая $(".previous.date").html(сюда дату), если это уже заложено в программе? Я могу только сожалеть о вашем положении, но не надо давить на жалость - вы невнимательны, не читаете и не думаете о том, что вам пишут. А если так, то над вами как нянькой можно сидеть по каждому мелочному вопросу, но толку не будет. Пора в себе менять отношение к тому что дают. |
Цитата:
Над вами никто не смеется, но не скрою, положение действительно смешное. Форум для программистов, почти 500 комментариев в теме и так и не решена задача на которую самое больше по времени требуется пол часа. |
laimas, рано пока к классам переходить) не работает все по той же причине, дело в скобках. Код из поста 467:
$.getJSON("http://h116641.s08.test-hf.su/", function(data) { $.each(data, function(k, o) { $.each(o, function(a, r) { $('.'+k+'.'+a).html( a=='date' ? r : {'USD':'$','EUR':'€'}[a] + ' ' + r.value.toFixed(2) + ' <b class=' + ['','down','up'][r.rate] +'>' + ['','▼','▲'][r.rate] +'</b>' )/*<-закрывающая скобка для html (строка №5)*/.attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' }/*<-закрывающая скобка для функции в attr (строка №7)*/)/*<-закрывающая скобка для attr (строка №7)*/ }/*<-закрывающая скобка для функции в each (строка №4)*/)/*<-закрывающая скобка для each (строка №4)*/ }/*<-закрывающая скобка для функции в each (строка №3)*/);/*<-закрывающая скобка для each (строка №3)*/ spinastr, Внимание, вопрос: когда придет конец несчастной $.getJSON("http://h116641.s08.test-hf.su/", function(data) { ? Закройте скобки и все заработает. |
Цитата:
Так не выводится в блок, дата $('.previous date').html(data.current.date); Отгадайте за 5 сек в чем тут проблема? Так рано о классах или пора? Я в этой горе теме обо всем уже рассказал, единственное что не сплясал еще. |
Manyasha,
Где тут закрыть скобки? $.getJSON("http://h116641.s08.test-hf.su/", function(data) { $('.previous date').html(data.current.date); $.each(data, function(k, o) { $.each(o, function(a, r) { $('.'+k+'.'+a).html( a=='date' ? r : {'USD':'$','EUR':'€'}[a] + ' ' + r.value.toFixed(2) + ' <b class=' + ['','down','up'][r.rate] +'>' + ['','▼','▲'][r.rate] +'</b>' ).attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' }) }) }); |
Цитата:
Опять по новому кругу размусоливать? |
Стёр тот конец, получилось так:
$('.previous date'); Не выводит js дату, Может сам js неверен? С точкой тоже не работает $('.previous.date'); |
Цитата:
|
Цитата:
Т.е. нужно как-то так: $.getJSON("http://h116641.s08.test-hf.su/", function(data) { $.each(data, function(k, o) { $.each(o, function(a, r) { $('.' + k + '.' + a).html(a == 'date' ? r : { 'USD': '$', 'EUR': '€' }[a] + ' ' + r.value.toFixed(2) + ' <b class=' + ['', 'down', 'up'][r.rate] + '>' + ['', '▼', '▲'][r.rate] + '</b>').attr('title', function() { return $(this).hasClass('title') ? data[k].date : '' }) }) }); }); |
Часовой пояс GMT +3, время: 02:06. |