forked from Berzeg07/learn-js
-
Notifications
You must be signed in to change notification settings - Fork 0
/
select.html
175 lines (145 loc) · 4.71 KB
/
select.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/style.css">
<title>Learn JS</title>
</head>
<body>
<script src="js/jquery-1.12.0.min.js"></script>
<div class="container">
<select name="" id="mySelect" onchange="funSelect()">
<option value="5">5</option>
<option value="10">10</option>
</select>
<select name="" id="mySelect2" onchange="funSelect()">
<option value="15">15</option>
<option value="20">20</option>
</select>
<div id="text_comment" style="margin-bottom:30px;"></div>
<input type="range" min="0" max="100" step="2" oninput="func_range()" id="r1">
<p id="one"></p>
<input type="text" id="i1">
<br>
<br>
<input id="ch1" type="checkbox" onchange="func_check()">
<p id="p1"></p>
<br>
<input name="radio" type="radio" value="5">5
<input name="radio" type="radio" value="3">3
<input name="radio" type="radio" value="535">535
<input type="text" name="price" id="inp">
<p id="text"></p>
<div class="script_fighter">
<h1>Скрипт для расчета рейтинга бойцов</h1>
Введите текущее кол-во очков бойца:
<br>
<input type="text" id="points">
<br>
<br> Введите кол-во побед решением:
<br>
<input type="text" id="w-des">
<br>
<br> Введите кол-во побед нокаутом:
<br>
<input type="text" id="w-ko">
<br>
<br> Введите кол-во поражений решением:
<br>
<input type="text" id="l-des">
<br>
<br> Введите кол-во поражений нокаутом:
<br>
<input type="text" id="l-ko">
<br>
<br>
<button id="btn">Расчитать</button>
<br>
<br> Результат:
<p id="result"></p><br><br>
<ul>
<li>Лион - 500</li>
<li>Паша - 400</li>
<li>Аслан - 300</li>
</ul>
</div>
<!-- script -->
<script>
document.getElementById('points').onkeypress = function (e) {
return !(/[А-Яа-яA-Za-z ]/.test(String.fromCharCode(e.charCode)));
}
var num_1 = 100;
var num_2 = 50;
$('#btn').click(function(){
var points = Number($('#points').val());
var win_points = (Number($('#w-des').val()) * num_2) + (Number($('#w-ko').val()) * num_1);
var loose_points = (Number($('#l-des').val()) * num_2) + (Number($('#l-ko').val()) * num_1);
var result = (win_points + points) - loose_points;
$('#result').html(result);
});
//==============================================================================================
// Получаем выбранную опцию
// function funTest() {
// var sel = document.getElementById('mySelect').selectedIndex;
// var options = document.getElementById('mySelect').options;
// alert('Выбрана опция ' + options[sel].text);
// }
// выводим изначальные значения селектов на экран
function sel() {
var xxx = $("select");
var names = 0;
$('option:selected', xxx).each(function () { names = Number(names) + Number(this.value); });
$('#text_comment').html(names);
}
sel();
// складываем выбраные значения
$(function funSelect() {
var xxx = $("select");
xxx.change(function () {
var names = 0;
$('option:selected', xxx).each(function () { names = Number(names) + Number(this.value); });
$('#text_comment').html(names);
}
);
}
);
// =========================================
// выводим значения range в параграф
// function func_range() {
// var rng = document.getElementById('r1');
// var p = document.getElementById('one');
// p.innerHTML = rng.value;
// }
// func_range();
// выводим значения range в инпут
function func_range() {
var rng = document.getElementById('r1');
var p = document.getElementById('i1');
i1.value = rng.value;
}
func_range();
// ============================================
// Проверка чекбокса на изменение состояния
function func_check() {
var ch = document.getElementById('ch1');
var ch_p = document.getElementById('p1');
if (ch.checked) {
$('#p1').html('выбран');
}
else {
$('#p1').html('НЕ выбран');
}
}
func_check();
// ===========================================
// выводим значения радио кнопок в инпут и параграф
$('input[name="radio"]').on('change', function (e) {
var val = $(this).val();
$('#inp').val(val);
$('#text').text(val);
});
</script>
</div>
<!-- container -->
</body>
</html>