JQuery: найти все входные данные без указанного цвета и добавляет текст к диапазону рядом с ним

Последнее обновление 24 сентября 2018 06:38:07 (UTC / GMT +8 часов)

script1adsense2code

script1adsense3code

jQuery Fundamental - I: Упражнение 34

Находит все входные данные, которые не имеют названия «color», и добавляет текст к диапазону рядом с ним.

 <Тело>
<DIV>
<input type = "radio" name = "color" value = "Red">
<SPAN> Красный </ SPAN>
</ DIV>
<DIV>
<input type = "radio" value = "Cold Fusion">
<SPAN> Sky </ SPAN>
</ DIV>
<DIV>
<input type = "radio" name = "accept" value = "Злые планы">
<SPAN> море </ SPAN>
</ DIV>
<button id = "button1"> Нажмите, чтобы увидеть эффект </ button>
</ Body>

Пример решения:

HTML-код:

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-git.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Finds all inputs that don't have the name 'color' and appends text to the span next to it.</title>
<style type="text/css">
button {
display: block;
margin: 20px 0 0 0;
} 
</style>
</head>
<body>
<div>
<input type="radio" name="color" value="Red">
<span>Red</span>
</div>
<div>
<input type="radio" value="Cold Fusion">
 <span>Sky</span>
 </div>
 <div>
 <input type="radio" name="accept" value="Evil Plans">
 <span>Sea</span>
 </div>
 <button id="button1">Click to see the effect</button>
 </body>
 </html>

Код JavaScript:

$('#button1').click(function(){ 
$( "input[name!='color']" ).next().append( "<b>: not a color</b>" );
});

См. Pen jquery- basic -упражнение-34 от w3resource ( @ w3resource ) на CodePen .

Внесите свой код и комментарии через Disqus.

Предыдущий: Находит все входные данные со значением «Красный» и изменяет текст следующего диапазона брата.
Далее: Находит все входные данные с именем атрибута, которое начинается с 'P', и помещает в них текст.