<div style="margin: 10px 0 10px 0">
<h3>Co-Editors</h3>
</div>
<p class="hide_editor" id="show_editor1">
<label for="subject_primary">Co-Editor 1:</label>
<select name='F_co_author1' id="co_author1" onchange="LoadExperts();">
<option value=''>No Coauthor 1</option>
</select>
</p>
<p class="hide_editor" id="show_editor2">
<label for="subject_primary">Co-Editor 2:</label>
<select name='F_co_author2' id="co_author2" onchange="LoadExperts();">
<option value=''>No Coauthor 2</option>
</select>
</p>
<p class="hide_editor" id="show_editor3">
<label for="subject_primary">Co-Editor 3:</label>
<select name='F_co_author3' id="co_author3" onchange="LoadExperts();">
<option value=''>No Coauthor 3</option>
</select>
</p>
<p class="hide_editor" id="show_editor4">
<label for="subject_primary">Co-Editor 4:</label>
<select name='F_co_author4' id="co_author4" onchange="LoadExperts();">
<option value=''>No Coauthor 3</option>
</select>
</p>
<button id='show_add_button' type="button" class="btn btn-success" style="display: block;">Add Co-Editor</button>
<script type="text/javascript" language="javascript"> // for loading the co-editors
//hide co-editors
$(".hide_editor").hide();
//show co-editor
$("#show_add_button").on("click", function () {
//$('#show_editor1').show();
// $('#show_editor2').show();
});
</script>
这四个下拉菜单在页面加载时被隐藏,但是现在当我单击添加按钮时,它应该仅显示第一个下拉菜单。
同样,我点击添加按钮,然后第二个下拉列表应该出现。
答案 0 :(得分:1)
以下代码可以解决您的问题。请注意,jQuery的返回行为与javascript的返回行为不同。
$("#show_add_button").on("click", function() {
$('.hide_editor').each(index => {
const current =$('.hide_editor')[index];
if(current.style.display === 'none') {
current.style.display = 'block';
return false;
}
});
});
答案 1 :(得分:0)
当您使用jQuery时,它会为实现该目标提供更好的方法。 更干净,更容易理解。
@given("a precondition")
def given_implementation(context)
pass
@when("step 1")
def when_implementation(context)
pass
#which annotation to use for and??
def and_implementation(context)
pass
@then("step 3")
def then_implementation(context):
pass