我有一个名为Rework的按钮,当我点击按钮时,必须出现两个复选框,并且Rework按钮应该消失,并且必须出现提交按钮。我将如何继续这个概念。
答案 0 :(得分:0)
你可以这样做:http://codepen.io/anon/pen/pjrwLe
**HTML**
<input type="button" id="rework-button" value="Rework" onclick="rework()"/>
<div id="checkboxes">
Check A: <input type="checkbox" />
Check B: <input type="checkbox" id="check-a" />
</div>
<input type="submit" id="submit-button" value="Submit"/>
**CSS**
#checkboxes,
#submit-button{
display:none;
}
**JAVASCRIPT**
function rework(){
document.getElementById("checkboxes").style.display = "block"
document.getElementById("submit-button").style.display = "block"
document.getElementById("rework-button").style.display = "none"
}
答案 1 :(得分:0)
理解这一点并根据需要进行编辑:
<div class='checkbx' style="display:none;">
<!--here goes your checkboxes-->
</div>
<input type='button' class'button1'/>
<input type='submit' class'button2'/>
<script>
$('.button1').click(function(){
$('.checkbx').show();
$('.button2').show();
$('.button1').hide();
});
</script>
这是jquery ..学习Jquery好的。 代码更少
注意:不要忘记包含jquery文件...阅读jquery
答案 2 :(得分:0)
您可以尝试这样的操作,点击返工时,如果它没有显示为无,则显示复选框并提交按钮。
function reworkClick() {
if (document.getElementById("Rework").style.display != "none"){
document.getElementById("Rework").style.display = "none";
document.getElementById("Submit").style.display = "block";
document.getElementById("checkboxContainer").style.display = "block";
}
}
答案 3 :(得分:0)
试试这个
<div class="input_box">
<input type="checkbox" name="vehicle" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle" value="Car"> I have a car<br>
<input type="submit" value="Submit">
</div>
<div class="button">
<input type="button" class="Rework" value="Rework">
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.input_box').hide();
$('.Rework').click(function(){
$('.button').hide();
$('.input_box').show();
});
});
</script>
希望这有帮助!