当我点击视图(id)时,该行必须消失,并且像往常一样,面板 - 身体部门必须显示由于手风琴而工作正常。我需要这样做才能点击视图(id)隐藏多个部门可以任何人给我建议如何做到这一点
这是我的HTML页面
<div id="accordion">
<div class="row" id="view">
<span class="col-md-4">Mobile Number</span>
<span class="col-md-4">7894561236</span>
<span class="col-md-4">Edit</span></span>
</div>
<div class="panel-body ">
<div class="row accordion-panel-bg">
<div class="col-md-7 col-md-offset-2 text-center">
<label class="col-md-4">Mobile Number</label>
<div class="col-md-8">
<input type="hidden" name="mobile_no" id="mobile_no" value="<?php echo $row->mobile_no; ?>" />
<input type ="text" class="form-control" name="mobile_no" id="mobile_no" value="<?php echo $row->mobile_no; ?>"/></br>
<input type="submit" value="Save" class="btn btn-success" style="width:70px;">
<!-- <button type="button" class="btn btn-success">Save</button>-->
<button type="button" class="btn btn-warning cancel-name">Cancel</button>
</div>
</div>
</div>
</div>
<div class="row">
<span class="col-md-4">Password</span>
<span class="col-md-4">XXXXX</span>
<span class="col-md-4">Edit</span></span>
</div>
<div class="panel-body ">
<div class="row accordion-panel-bg">
<div class="col-md-7 col-md-offset-2 text-center">
<label class="col-md-4">Password</label>
<div class="col-md-8">
<input type="hidden" name="password" id="password" value="<?php echo $row->password; ?>" />
<input type ="text" class="form-control" name="password" id="password"/></br>
<input type="submit" value="Save" class="btn btn-success" style="width:70px;">
<!-- <button type="button" class="btn btn-success">Save</button>-->
<button type="button" class="btn btn-warning cancel-name">Cancel</button>
</div>
</div>
</div>
</div>
</div>
这是我使用的脚本
<script>
$(function () {
$("#accordion").accordion({collapsible: true, active: false});
});
$("doccument").ready(function(){
$("#view").click(function(){
$("#view").hide();
});
});
</script>
答案 0 :(得分:1)
建议如下:
<强>的JavaScript 强>
$(function () {
$("#accordion").accordion({
collapsible: true,
active: false
});
$("#view").click(function(){
$(this).hide();
});
});
这将隐藏#view
元素。没有办法取消隐藏它,因此如果用户导航到另一个面板,他们将无法返回。工作示例:https://jsfiddle.net/Twisty/przndthk/
这在我看来有点奇怪。您可能需要考虑更类似的内容:https://jsfiddle.net/Twisty/przndthk/3/