Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.03.2013, 23:54
Интересующийся
Отправить личное сообщение для Findail Посмотреть профиль Найти все сообщения от Findail
 
Регистрация: 23.03.2013
Сообщений: 14

html код в зависимости от выбора radio
Есть онлайн калькулятор, мне нужно что бы в зависимости от выбора пользователем опции radio в конечной форме выдавалось сообщение, типа вы выбрали "Тип R1" или другой в зависимости от выбора пользователя...
Как это реализовать?
Ответить с цитированием
  #2 (permalink)  
Старый 27.03.2013, 07:42
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

<!DOCTYPE html>
<form id="calculator">
    <label><input type="radio" name="type" value="R1" /> R1</label>
    <label><input type="radio" name="type" value="R2" /> R2</label>
    <button type="submit">Заслать</button>

    <script>
        (function(){
            function getCheckedRadio(radios) {
                for (var i = 0; i < radios.length; i++) {
                    if (radios[i].checked) {
                        return radios[i];
                    }
                }
                return null;
            }
            var form = document.forms.calculator;
            form.onsubmit = function(){
                var type = getCheckedRadio(form.type);
                if (type) {
                    alert('Вы выбрали тип: ' + type.value);
                }
                return false;
            }
        })();
    </script>
</form>
Ответить с цитированием
  #3 (permalink)  
Старый 27.03.2013, 08:28
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

В современных браузерах можно на чистом css:
<style>
form > span {
    display: none;
}
#R1:checked ~ .R1, #R2:checked ~ .R2 {
    display: inline;
}
</style>
<form id="calculator">
    <input type="radio" name="type" id="R1" value="R1" checked/><label for="R1"> R1</label>
    <input type="radio" name="type" id="R2" value="R2" /><label for="R2"> R2</label>
    <br />
    Вы выбрали тип: <span class="R2">R2</span><span class="R1">R1</span>
</form>
__________________
29375, 35
Ответить с цитированием
  #4 (permalink)  
Старый 28.03.2013, 21:53
Интересующийся
Отправить личное сообщение для Findail Посмотреть профиль Найти все сообщения от Findail
 
Регистрация: 23.03.2013
Сообщений: 14

Вот мой скрипт:
<SCRIPT LANGUAGE="JavaScript">
function price(form) {
var iadro = 0;
if(document.getElementById('R1').checked) {
iadro=parseFloat(form.R1.value);
}
if(document.getElementById('R4').checked) {
iadro=parseFloat(form.R4.value);
}
if(document.getElementById('R5').checked) {
iadro=parseFloat(form.R5.value);
}
if(document.getElementById('R7').checked) {
iadro=parseFloat(form.R7.value);
}

var nachalo = 0;
if(document.getElementById('Da').checked) {
nachalo=parseFloat(form.Da.value);
} 
if(document.getElementById('Net').checked) {
nachalo=parseFloat(form.Net.value);
}

var result = 0;
if(document.getElementById("result")){
result=parseFloat(form.result.value);
result*=0.001;
}

if (form.stat.checked){
var stat=parseFloat(form.stat.value);
}
else stat=0;
if (form.podpiska.checked){
var podpiska=parseFloat(form.podpiska.value);
}
else podpiska=0;

if(document.getElementById("number")){
number=parseFloat(form.number.value);
}

var total=44+(result*iadro+nachalo+stat+podpiska)*number;
document.getElementById("total_price").innerHTML=total;

}


Вот кнопка для выполнения функции
<input value="Посчитать" type="button" onclick="price(this.form)">


как сделать что бы по нажатию этой же кнопки ниже писался текст, что вы выбрали тип R1 или R4...
Ответить с цитированием
  #5 (permalink)  
Старый 28.03.2013, 22:52
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Findail однозначно китаец.

<!DOCTYPE html>
<form id="calculator">
    <label><input type="radio" name="type" value="R1" /> R1</label>
    <label><input type="radio" name="type" value="R2" /> R2</label>
    <button type="button" id="calculate">Посчитать</button>
    <output id="message"></output>
    <script>
        (function(){
            var texts = {
                message: 'вы выбрали тип '
            }
            function getCheckedRadio(radios) {
                for (var i = 0; i < radios.length; i++) {
                    if (radios[i].checked) {
                        return radios[i];
                    }
                }
                return null;
            }

            var form = document.forms.calculator;
            var button = document.getElementById('calculate');
            var message = document.getElementById('message');
            button.onclick = price;
            
            function price() {
                var type = getCheckedRadio(form.type).value;
                message.innerHTML = texts.message + type;
            }
        })();
    </script>
</form>


Чуть подпилить - и готово.
Ответить с цитированием
  #6 (permalink)  
Старый 30.03.2013, 11:49
Интересующийся
Отправить личное сообщение для Findail Посмотреть профиль Найти все сообщения от Findail
 
Регистрация: 23.03.2013
Сообщений: 14

Я новичек,много не понимаю, уже как только не крутил не могу заставить работать(
Ответить с цитированием
  #7 (permalink)  
Старый 30.03.2013, 12:53
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Findail
как только не крутил
Ну показывый, как ты крутил.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
передача текста в textarea в зависимости от выбора radiobutton AndreiN Общие вопросы Javascript 4 07.02.2016 23:34
Расчет формулы в зависимости от выбора MasterHrust Javascript под браузер 1 28.09.2011 15:37
Усовершенствование скрипта доступности поля в зависимости от выбора в списке. neonlight Общие вопросы Javascript 3 10.07.2011 10:05
Вывод в зависимости от выбора amen Элементы интерфейса 3 10.02.2010 18:24
Открытие окна в зависимости от выбора в <option> partyzan Общие вопросы Javascript 0 10.04.2008 01:00