HTML: переключатель - PullRequest
Новая
       2

HTML: переключатель

0 голосов
/ 25 ноября 2018

В приведенном ниже коде пользователь должен выбрать, есть ли у него автомобиль или нет, с помощью радиокнопки.если установлен переключатель «да», поле ввода «имя автомобиля» включено, если установлен переключатель «нет», поле ввода «имя автомобиля» отключено. При нажатии кнопки «да» появляется кнопка «тест».установлен, но функция, связанная с переключателем «да», не срабатывает.

Может кто-нибудь объяснить, почему функция, связанная с переключателем «да», не срабатывает при нажатии кнопки «тест»?

Есть ли способ добиться этого?i, e когда нажата кнопка «тест», нужно установить переключатель «да», и это должно вызвать функцию enable_carname. 

<!DOCTYPE html>
<html>
<body>

<h2>Radio Buttons</h2>

<form>
please choose:
<div>have car:</div> 
<input type="radio" name="car" id="no" value="no" onchange="disable_carname()" > no<br>
<input type="radio" name="car" id="yes" value="yes" onchange="enable_carname()"checked>yes<br>
carname:<input type="text" id="carname">
</form> 
<button onclick="set_yes_radio()">test</button>
</body>
<script>
function disable_carname()
{
	document.getElementById("carname").disabled=true;
}

function enable_carname()
{
	document.getElementById("carname").disabled=false;
}

function set_yes_radio()
{
	document.getElementById("yes").checked=true;
}
</script>
</html>

Спасибо.

Ответы [ 3 ]

0 голосов
/ 25 ноября 2018

установить onclick в качестве атрибута вашего входа, как это 

<input type="radio" name="car" id="no" value="no" onclick="disable_carname()" > no<br>
0 голосов
/ 25 ноября 2018

Может кто-нибудь объяснить, почему функция, связанная с переключателем "да", не срабатывает при нажатии кнопки "тест"?

Это потому, что вы не вызываете enable_carname()функция, то есть - вы на самом деле не меняете кнопку «Да» на «проверено».Согласно вашей настройке, решение будет таким: 

function disable_carname() {
    document.getElementById("carname").disabled=true;
}

function enable_carname() {
    document.getElementById("carname").disabled=false;
}

function set_yes_radio() {
    document.getElementById("yes").checked=true;
    enable_carname(); //invoking the function which will actually enable 'carname' field
}

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

Может быть, попытаться подумать о состоянии по умолчанию.Допустим, кнопка «нет» по умолчанию включена и поле carname отключено.Вместо кнопки test это может быть submit.Я представляю, что это часть опроса или нечто подобное.Если вы хотите попробовать другой подход, попробуйте и дайте мне знать, если вам нужна дополнительная помощь.

Кстати, отметьте как установить атрибут для элемента DOM вместо жесткого-Кодировать это в HTML.Конечно, вы также можете удалить его аналогичным образом.

Примечание: текст carname должен быть <label> для поля ввода 'carname'. MDN: этикетка

0 голосов
/ 25 ноября 2018 
<!DOCTYPE html>


<h2>Radio Buttons</h2>

<form>
    please choose:
    <div>have car:</div>
    <input type="radio" name="car" id="no" value="no" onclick="disable_carname()"> no<br>
    <input type="radio" name="car" id="yes" value="yes" onclick="enable_carname()" checked>yes<br>
    carname:<input type="text" id="carname">
</form>
<button onclick="set_yes_radio()">test</button>
<script>
    function disable_carname() {
        document.getElementById("carname").disabled = true;
    }

    function enable_carname() {
        document.getElementById("carname").disabled = false;
    }

    function set_yes_radio() {
        document.getElementById("yes").checked = true;
    }
</script>

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...