溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
RadioGroup是一種HTML表單元素，用于創建一組單選按鈕。在Web表單中，RadioGroup通常用于讓用戶從幾個選項中選擇一個。
動態表單項的添加與刪除可以通過JavaScript來實現。下面是一個簡單的例子，演示如何使用JavaScript向表單中的RadioGroup添加和刪除選項。
<!DOCTYPE html>
<html>
<head>
<title>Dynamic RadioGroup</title>
</head>
<body>
<form id="myForm">
<div id="radioGroup">
<input type="radio" name="option" value="option1">Option 1<br>
<input type="radio" name="option" value="option2">Option 2<br>
</div>
<button type="button" onclick="addOption()">Add Option</button>
<button type="button" onclick="removeOption()">Remove Option</button>
</form>
<script>
function addOption() {
var radioGroup = document.getElementById('radioGroup');
var newOption = document.createElement('input');
newOption.type = 'radio';
newOption.name = 'option';
newOption.value = 'option' + (radioGroup.getElementsByTagName('input').length + 1);
newOption.id = 'option' + (radioGroup.getElementsByTagName('input').length + 1);
var label = document.createElement('label');
label.innerHTML = 'Option ' + (radioGroup.getElementsByTagName('input').length + 1) + '<br>';
radioGroup.appendChild(newOption);
radioGroup.appendChild(label);
}
function removeOption() {
var radioGroup = document.getElementById('radioGroup');
if (radioGroup.getElementsByTagName('input').length > 2) {
var lastOption = radioGroup.getElementsByTagName('input')[radioGroup.getElementsByTagName('input').length - 1];
var lastLabel = radioGroup.getElementsByTagName('label')[radioGroup.getElementsByTagName('label').length - 1];
radioGroup.removeChild(lastOption);
radioGroup.removeChild(lastLabel);
} else {
alert('Cannot remove any more options');
}
}
</script>
</body>
</html>
在上面的例子中，我們創建了一個包含兩個選項的RadioGroup，并添加了兩個按鈕，一個用于添加選項，另一個用于刪除選項。通過點擊這兩個按鈕，用戶可以動態地向RadioGroup中添加或刪除選項。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
