Блог

Главная - Вопросы по программированию - Я хочу изменить метку с помощью onclick

Я хочу изменить метку с помощью onclick

#javascript #html #onclick

Вопрос:

Мне нужна помощь. Я новичок в javascript и хочу изменить «метку для font_color» и «метку для font_family» с помощью onclick. Прямо сейчас текст, который я ввожу во ввод, меняется, но не в метке, которую я хочу изменить.

 function swap_color_and_font() {
    document.getElementsById("font_color").style.color="pink"; 
    document.getElementById("font_family").style.fontFamily="arial"; 
}

<form>  
     <fieldset>  
     <label for="font_color">Font color</label><br/>
     <input type="text" id="font_color" value=""/><br/>
     <label for="font_family">Font</label><br/>
     <input type="text" id="font_family" value=""/><br/>
     <input onclick="swap_color_and_font()" value="Byt ut färg och font" type="button"/>
     </fieldset>

Комментарии:

1. Опечатка. Здесь нет никакой document.getElementsById функции. Кроме того, вы всегда должны проверять консоль своего браузера на наличие ошибок, это говорит вам об этом.

2. Вы хотите изменить цвет и семейство фон элемента метки или элемента ввода с указанным идентификатором?

3. Я хочу изменить цвет и семейство шрифтов элемента метки

Ответ №1:

поскольку идентификатор=»» находится на входе, поэтому, когда функция запускается, это повлияет на ввод, а не на метку, поэтому вы можете поместить 2 идентификатора в метки

Ответ №2:

Вы можете добавить идентификаторы к метке и вместо этого изменить их стили

 function swap_color_and_font() {
    document.getElementById("label_1").style.color="pink"; 
    document.getElementById("label_2").style.fontFamily="arial"; 
}
<fieldset>  
 <label for="font_color" id="label_1">Font color</label><br/>
 <input type="text" id="font_color" value=""/><br/>
 <label for="font_family" id="label_2">Font</label><br/>
 <input type="text" id="font_family" value=""/><br/>
 <input onclick="swap_color_and_font()" value="Byt ut färg och font" 
 type="button"/>
</fieldset>
Метки: