Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Вывод курса валют (https://javascript.ru/forum/misc/72548-vyvod-kursa-valyut.html)

spinastr 11.02.2018 06:12

laimas,

Это сюда, читать, изучать, пробовать. Пример я привел, дальше сами.

Спасибо вам!

Уже почти всё сделано, как в текущий курс стрелку динамики вывести, уже устал сейчас ещё неделю сидеть придётся.



просто знак доллара, цифры и стрелка динамики, зелёная вверх, красная вниз.

spinastr 11.02.2018 06:23

Я не понимаю где тут стрелка что бы в первый блок поставить?
<div class="ratehead">
<span class="current"></span>
</div>
 

 <div class="ratebox">
 <span class="current"></span>
 <span class="previous"></span>
</div>
 
<script>
$.getJSON("домен.ру", function(data) {
 $.each(data, function(k, o) {
 $('.'+k).text(o.value).addClass(['down','up'][o.rate])
 })
});
</script>

spinastr 11.02.2018 06:30

Все стили удалил, доллар пропал,

стрелок нет



в самом начале форума кто всё без стилей прописавали и всё без стилей было, просто один div.

Как так сделать?

<script> 
$.getJSON("https://www.cbr-xml-daily.ru/daily_json.js", function(data) { 
var Value = data.Valute.USD.Value 
var Previous = data.Valute.USD.Previous 
function trend(Value, Previous) { 
if (Value > Previous) return '<b style="color:#00ff00;"> ▲</b>'; 
if (Value < Previous) return '<b style="color:#ff0000;"> ▼</b>';
return ''; 
} 
var trend = trend(data.Valute.USD.Value, data.Valute.USD.Previous); 
 $('#usd').html("USD ЦБ&nbsp;&nbsp;" +data.Valute.USD.Value.toFixed(1) +trend); 
}); 
</script>

laimas 11.02.2018 06:31

Цитата:

Сообщение от spinastr
где тут стрелка что бы в первый блок поставить?

Нет тут никаких стрелок, стрелки у символы доллара курсов задаются в стилях через content

content: "▲";

В элементы class="current" и class="previous" помещаются только курсы.

Вникайте, в самим стилях видны стрелочки, а что это означает можете же поинтересоваться и узнать на htmlbook? Все, сами, не сложно разобраться по именам css правил, что к чему.

laimas 11.02.2018 06:32

spinastr,
достали вы уже всякой хренью смешивая одно с другим.

Все, изучайте и не задавайте больше вопросов.

spinastr 11.02.2018 06:35

laimas,

тогда какой смысл три дня сидели делали, а в итоге это в шапку вставить нельзя,

spinastr 11.02.2018 06:45

laimas,
Осталось, только стрелку вывести


spinastr 11.02.2018 06:54

Почему у вас видна стрелка?



Вчё у меня ошибка?

spinastr 11.02.2018 06:58

Получается блок со стрелкой оборачивает блок с данными курса доллара

<div class="ratehead">
<span class="current"></span>
</div>


стиль стрелки

.ratehead * {
 color: #fff;
}

.ratehead *:after {
 color: #fff; /*белый цвет стрелки*/
}



А стрелки нету

spinastr 11.02.2018 07:10

Может эти стрелки как то так прописать что бы не мучится куда стрелка пропала?

if (Value > Previous) return '<b style="color:#00ff00;"> ▲</b>';
07
if (Value < Previous) return '<b style="color:#ff0000;"> ▼</b>';

laimas 11.02.2018 12:16

spinastr,
лень не лучший помощник в написании сайта и вашу лень я обслуживать не буду. Не копировать один в один верстку и стили предлагаемые, а читать и вникать, что это и как работает. А поняв применять у себя.

Нет стрелки вверху потому, что стиль перекрывается другим стелем в шапке.

Хотите сами втыкать стрелочки, на здоровье, я комментирую, а делайте сами.

Этой хрени Value > Previous не требуется, сервер уже вернул готовое в rate: 1 - курс вырос, 0 - курс упал.

Всяких функций в JS и прочей бодяги тоже не требуется - адресом куда будет помещен курс служат ключи json. Элемент текущего курса имеет класс current, предыдущего previous.

Удалите все стили что я писал, оставив только это:

.up {
    color: #0f0; /*зеленый цвет*/
}
  
.down {
    color: #f00;
}


А для этих классов что будут в шапке - белый, что в чем в вашей шапке - самостоятельно разобраться.

$.getJSON("чего-то там", function(data) {
    $.each(data, function(k, o) {
        $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>')
    })
});

spinastr 11.02.2018 16:01

laimas,

Спасибо, вам но я не лентяй, так как уже вторую неделю пытаюсь сделать курс. И в Вашем скрипте двое суток не спал и пытался понять. Просто говорю никогда не встречался с php и js. Знаю на 77% HTML и css.

<style>
.up {color: #0f0; /*зеленый цвет*/}
.down {color: #f00;}
</style>
 
<div class="ratehead">
<span class="current"></span>
</div>
 
<script>
$.getJSON("домен.ру", function(data) {
    $.each(data, function(k, o) {
        $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>')
    })
});
</script>




Что значит эта надпись и стрелки нету?

Не поленился, почитал тут. Понял что две проблемы может быть.

1. Функция без директивы return возвращает undefined.
2. Обращение к несуществующему свойству объекта также даст undefined.

А как что исправить, я не понимаю, подскажите в чём тут ошибка?

laimas 11.02.2018 16:28

Цитата:

Сообщение от spinastr
Знаю на 77% HTML и css.

А что же тогда мечетесь, давно уже можно было разобраться со стрелкой.

.имя родительского_класса_в_шапке .up:after {
    dispaly: block; /*или block!important; или ... найти, понять изменить, отладчик бразуера в помощь*/
    color: #fff; /*белый цвет*/
}


Тоже самое и для .down:after который в шапке. Вы даже не добавили в CSS стиль цвета для стрелки в шапке, это разве не лень, если знать на 77% HTML и css?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<style>
.ratehead {
    background-color: #0164C6;
    color: #fff;
}
.ratehead .up, .ratehead .down {
    color: #fff;
}
</style>

<div class="ratehead">
<span class="current"></span>
</div>

<script>
//именно такое и получит Ajax
var data = {"current":{"date":"11.2.2018","value":58.17,"rate":1},"previous":{"date":"10.2.2018","value":57.67,"rate":1}};

//и вот тут данные этого объекта помещаются на свои места 
    $.each(data, function(k, o) {
        $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>')
    })
</script>


Все на месте?

spinastr 11.02.2018 16:56

laimas,

<style>
.up {color: #0f0; /*зеленый цвет*/}
.down {color: #f00;}
</style>

<div class="ratehead">
<span class="current"></span>
</div>

<script>
//именно такое и получит Ajax
var data = {"current":{"date":"11.2.2018","value":58.17,"rate":1},"previous":{"date":"10.2.2018","value":57.67,"rate":1}};

//и вот тут данные этого объекта помещаются на свои места 
    $.each(data, function(k, o) {
        $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>')
    })
</script>




Да, спасибо сейчас выглядит как я хотел.

Ещё вопрос:

1. Можно в подсказку при наведении вывести дату курса? Что бы не лазить на хост и не проверять.

2. Куда пропала строка с кодом где написан домен и почему работает без него?

$.getJSON("домен.ру", function(data) {

spinastr 11.02.2018 16:59

Снова ошибка undefined

<script>
//именно такое и получит Ajax
$.getJSON("домен.ру", function(data) {


//и вот тут данные этого объекта помещаются на свои места 
    $.each(data, function(k, o) {
        $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>')
    })
});
</script>

Nexus 11.02.2018 17:07

215+ сообщений в теме и так и не удалось решить 15-минутную задачу )

spinastr, undefined на месте "стрелочки" означает, что у вас "o.rate" не является целочисленным больше 0 и меньше или равно 1.
Ошибка в данных, выведите их в консоль и посмотрите, что вам вернул сервер.

spinastr 11.02.2018 17:12

Цитата:

Сообщение от Nexus (Сообщение 477682)
215+ сообщений в теме и так и не удалось решить 15-минутную задачу )

spinastr, undefined на месте "стрелочки" означает, что у вас "o.rate" не является целочисленным больше 0 и меньше или равно 1.
Ошибка в данных, выведите их в консоль и посмотрите, что вам вернул сервер.

Я не понимаю, какая консоль, какой сервер?

Я сижу в инвалидной коляски у меня спастика в ногах уже устал, что за мучения?

Простите!

laimas 11.02.2018 17:14

Цитата:

Сообщение от spinastr
1. Можно в подсказку при наведении вывести дату курса? Что бы не лазить на хост и не проверять.

Можно, и для этого на сервер лазить не надо, даты курса уже есть в json. Как по наведению их показать, насколько я помню пример приводили. HTML средствами это делается просто:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<style>
.ratehead {
    background-color: #0164C6;
    color: #fff;
}
.ratehead .up, .ratehead .down {
    color: #fff;
}
</style>

<div class="ratehead">
<span class="current"></span>
</div>

<script>
//именно такое и получит Ajax
var data = {"current":{"date":"11.2.2018","value":58.17,"rate":1},"previous":{"date":"10.2.2018","value":57.67,"rate":1}};

//и вот тут данные этого объекта помещаются на свои места 
    $.each(data, function(k, o) {
        $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>').attr("title", o.date)
    })
</script>


О "красивеньких подсказках" искать и читать в сети, в частности тут. Это можно сделать?

Цитата:

Сообщение от spinastr
2. Куда пропала строка с кодом где написан домен и почему работает без него?

Никуда ничего не пропало, это пример для того чтобы он работал здесь на форме, поэтому просто разбор самого объекта.

Те кто не знают JS, используют jQuery, и ничего, не страшно. Пора начинать изучать. За три дня все не получится, но так и должно быть, учение требует и времени, и упорства.

Цитата:

Сообщение от spinastr
Снова ошибка

Открывать отладчик браузера и ....

spinastr 11.02.2018 17:34

laimas,
1. tooltip - мне ненужно, просто вывести в

title="СЮДА ВЫВЕСТИ ДАТУ - Посмотреть курс валют"

.attr('title', data.Date +"- Посмотреть курс валют")


Совместить?


2. Открыл консоль и что там делать?

https://pp.userapi.com/c840434/v8404...OaNndEOmko.jpg

spinastr 11.02.2018 17:47

Про подсказку понял:

$('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>')
$('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>').attr("title", o.date)

.attr("title", o.date)


Тут хранится дата из джексона o.date

spinastr 11.02.2018 18:02

Спасибо что мне помогаете, это очень ценная информация, но я не вриилансэр.

6 лет сам делаю сайт на юкоз и чему то учусь.

Но: Те кто не знают JS, используют jQuery,
В данной ситуации, кто не умеет строить, открывайте учебник и идите на объект.

что за дом в результате получится?

открыл я это и ... ?

Может через год или два изучения смогу сам вывести стрелку?

Подскажите пожалуйста что делать?

spinastr 11.02.2018 18:41

Посидел почитал, как стрелку вывести почему ошибка? Что там не так и нехватает?

laimas 11.02.2018 19:22

Цитата:

Сообщение от spinastr
Совместить?

Ну я откуда могу значит чего надо? Надо с датой текст, совмещайте, что-то иное, на здоровье. Спрашивалось как вывести дату - через атрибут title. А надо ли ее в горошек раскрасить, это уже не мне решать.

Если по уму, то курсы которые выводятся в боксе сразу должны отображать дату, а не два курса в две строки хрен знает какой за что.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<style>
.ratebox > * {
    display: block;
}

.ratebox .up {
    color: #0f0;
} 

.ratebox .down {
    color: #f00;
}

.ratehead {
    background-color: #0164C6;
    color: #fff;
}
.ratehead .up, .ratehead .down {
    color: #fff;
}
</style>
 
<div class="ratehead">
<span class="current"></span>
</div>

<div class="ratebox">
 <span class="current"></span>
 <span class="previous"></span>
</div>
 
<script>
//именно такое и получит Ajax
var data = {"current":{"date":"11.2.2018","value":58.17,"rate":1},"previous":{"date":"10.2.2018","value":57.67,"rate":1}};
 
//и вот тут данные этого объекта помещаются на свои места
    $(".current,.previous").each(function() {
        var a = $(this), b = this.className, c = a.parent().hasClass('ratebox'); 
        a.html((c ? '<b>'+data[b].date+'</b>' : '') + 
                    " <b>$ " + data[b].value + '</b> <b class=' + ['down','up'][data[b].rate] +'>' + ['▼','▲'][data[b].rate] +'</b>')
                    .attr("title", !c ? data[b].date : "")
    })
</script>

spinastr 11.02.2018 19:32

laimas,
Все запуталось.

Снпчало все работало, был курс. но не было стрелки.

Теперь в 15 строчке прописаны готовые значения.

А курса с jsona там нет.

Все работало, только стрелку вывести оставалось.

Теперь стрелка есть, а курса нет

laimas 11.02.2018 19:34

Цитата:

Сообщение от spinastr
что за дом в результате получится?

Строят себе дома и не строители, я не являясь строителем сам делаю и дизайн который хочу, и плитку ложу, и много еще чего. Если мужика не учили в школе табурет делать, хреново.

Не надо искать оправданий, надо изучать. У каждого здесь есть и работа, и свои заботы, прыгать и скакать вокруг вас длительное время ни кто не станет. Учитесь добывать нужную информацию и изучать ее.

Хрен знает что у вас творится на сайте и почему нет стрелки. Она определяется цифрой 1 или 0, которые у курса находятся в json - "rate":1. Я писал об этом? Писал, сложно это проверить в json что отдает сервер? Если они есть, то и проблем не должно быть ибо они только индексы для выборки из массивов:

['down','up'][data[b].rate] - это добавит класс 'down' или 'up' стрелке, а значит определит ее цвет.
['▼','▲'][data[b].rate] - это определить символ стрелки.

Попробуйте догадаться какая стрелка будет выбрана и имя класса из этих массивов при значении data[b].rate равном 0 и 1.

spinastr 11.02.2018 19:53

То есть у меня на сайте проблема в внутри? Какой то скрипт и не отображается стрелка?

laimas 11.02.2018 20:02

Я не знаю что еще можно рассказывать. Как получаются стрелки и их цвет, рассказано. Они могут не отображаться, если только сервер вернет в json пустые значения у rate. Запрос к серверу показывает, что он отдает все о курсах, включая и динамику курса.

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

spinastr 11.02.2018 20:41

laimas,

ВОТ МОЙ КОД

он работает, только нету стрелки,

<style>
.up {color: #0f0; /*зеленый цвет*/}
.down {color: #f00;}
</style>

<div class="ratehead">
<span class="current"></span>
</div>

<script>
//именно такое и получит Ajax
$.getJSON("домен.ру", function(data) {


//и вот тут данные этого объекта помещаются на свои места 
 $.each(data, function(k, o) {
 $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>').attr("title", o.date)
 })
});
</script>


<div class="ratehead">
<span class="current"></span>
</div>

j0hnik 11.02.2018 20:43

23 страницы, ну вы блин даете, есть ведь готовые модули

spinastr 11.02.2018 20:46

j0hnik,

Пожалуйста подскажите? Я уже устал

j0hnik 11.02.2018 20:48

https://www.google.ru/search?newwind....0.GFTITeOE3KY

берите любой. правьте стили и вуаля!

spinastr 11.02.2018 20:51

j0hnik,
спасибо, но мне нужно с ЦБ РФ

и чтобы в дизайн подошло, всё работает только стрелок нет

вот

https://pp.userapi.com/c830309/v8303...twzbhaRUr8.jpg

spinastr 11.02.2018 20:55

laimas,

что этим примером записывать в переменную дата

var data = {"current":{"date":"11.2.2018","value":58.17,"rate":1},"previous":{"date":"10.2.2018","value":57.67,"rate":1}};

spinastr 11.02.2018 21:03

Может у меня библиотека не подходит ?

jquery-1.7.2.js

laimas 11.02.2018 21:05

Ничего не записывать, нельзя с форума обратиться к вашему серверу за курсом валюты, и чтобы показать работу кода, он написан без:

$.getJSON("http://....ru", function(data) {

а только что внутри этой функции. Поэтому для работы примера на форуму используется объект, под тем же именем, что и функции:

var data =

И объект в примере, это как раз то, что и возвращает ваш сервер, и все на месте, включая и то, что определяет стрелки

{"current":{"date":"11.2.2018","value":58.17,"rate":1},"previous":{"date":"10.2.2018","value":57.67,"rate":1}}

Вот что в этом может быть непонятного, что еще тратить время и на эти пояснения?

laimas 11.02.2018 21:07

Да 1.7, это очень допотопное, подключайте jQury например так
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
тут актуальная всегда

Manyasha 11.02.2018 21:08

Цитата:

Сообщение от spinastr (Сообщение 477721)
laimas,

ВОТ МОЙ КОД

он работает, только нету стрелки,

<style>
.up {color: #0f0; /*зеленый цвет*/}
.down {color: #f00;}
</style>

<div class="ratehead">
<span class="current"></span>
</div>

<script>
//именно такое и получит Ajax
$.getJSON("домен.ру", function(data) {


//и вот тут данные этого объекта помещаются на свои места 
 $.each(data, function(k, o) {
 $('.'+k).html("$ " + o.value + ' <b class=' + ['down','up'][o.rate] +'>' + ['▼','▲'][o.rate] +'</b>').attr("title", o.date)
 })
});
</script>


<div class="ratehead">
<span class="current"></span>
</div>

что у Вас вместо домен.ру?
или на 13-й строчке напишите console.log(data), что возвращает?

spinastr 11.02.2018 21:15

Цитата:

Сообщение от laimas (Сообщение 477730)
Да 1.7, это очень допотопное, подключайте jQury например так
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
тут актуальная всегда

на юкозе стандартно, стоит и лучше не менять.

spinastr 11.02.2018 21:16

laimas,

кинуть ссылку на хост?

laimas 11.02.2018 21:25

Цитата:

Сообщение от spinastr
на юкозе стандартно, стоит и лучше не менять.

Под запросом поместить

$.getJSON("http://.....ru", function(data) {
console.log(data); //эту строку добавить

В отладчике браузера в консоли будет что-то? Должен быть вот этот объект
{"current":{"date":"11.2.2018","value":58.17,"rate ":1},"previous":{"date":"10.2.2018","value":57.67, "rate":1}}


В отладчике во вкладке сеть тоже ответ сервера посмотреть.


Часовой пояс GMT +3, время: 11:57.