我有一个复选框。。。。
<input type="checkbox" name="idis" id="1" value="1" class="input-hidden" />
<input type="checkbox" name="idis" id="2" value="2" class="input-hidden" />
<input type="checkbox" name="idis" id="8" value="8" class="input-hidden" />
<input type="checkbox" name="idis" id="9" value="9" class="input-hidden" />
如果选择了上面的4个输入选项中的任何一个，我想在页面底部显示一个运行列表。。。。因此，如果idis 2&9被选中，它将在底部显示。。
ID：2，9。
我认为您可以使用jquery-fadein和fadeout。来自w3cshool的演示，不确定这是你想要的吗？更清楚地解释您的问题，您希望实现
你可以试试我制作的小提琴：jsFiddle
// Get a handle on all inputs
var inputs = document.getElementsByTagName('input');
// Get a handle on all labels
var labels = document.getElementsByTagName('label');
// Attach event handlers
for(var i = 0; i < inputs.length; i++){
if(inputs[i].type === 'checkbox'){
inputs[i].onchange = showChecked
}
}
// Function to display currently checked elements
function showChecked(){
// Get a handle on the results div
var results = document.getElementById('results');
// Reset the content of results
results.textContent = "";
// Check each checkbox and add their label to the results div
for(var i = 0; i < inputs.length; i++){
if(inputs[i].type === 'checkbox' && inputs[i].checked == true){
results.textContent += labels[i].textContent + ', ';
}
}
}
我举了一个例子，不确定它是否是您想要的：这是HTML
<input type="checkbox" value="check1" class="input-hidden" /><label for="check1">check1</label>
<input type="checkbox" value="check2" class="input-hidden" /><label for="check2">check2</label>
<input type="checkbox" value="check3" class="input-hidden" /><label for="check3">check3</label>
<input type="checkbox" value="check4" class="input-hidden" /><label for="check4">check4</label>
<div id="relt"></div>
这是JS：
$(".input-hidden").on("click", function(e){
var relts = $(".input-hidden:checked").map(function(i,n){
return n.value
});
$("#relt").text(relts.get().join(","));
})
您可以在jsfiddle 上检查这一点