Jq 标签的显示与隐藏+禁止与解禁+样式的更改
CSS样式
1. addclass();
.css1{
background-color:red;
}
$(".aui_state_focus").addclass(“css1”);
2.attr();
$(".aui_state_focus").removeAttr("style"); //移除样式 $(".aui_state_focus").attr("style", "position:relative;left:142px;top:400px;z-index:1989;border:2px solid;"); //新增样式
3.css();
$(".aui_state_focus").css("top", "284px");
4.toggle();切换背景颜色,
禁止与解禁
1.attr(); 禁止按钮点击,禁止输入文本框
$(".res-btn input").attr( "disabled","disabled" ); $(".res-btn input").removeAttr("disabled");
2. 动态增加删除onlick属性达到禁止与解禁
$("#smdl").attr("onclick", "smdl_onclick();"); //新增onclick属性 $("#smdl").removeAttr("onclick"); //删除onclick属性
显示与隐藏
(1)display
1、不覆盖控件的其他样式,进行显示和隐藏控制 用如下方法: 显示: $('#id).css('display','block'); 等同 $('#id)[0].style.display='block'; 等同 $('#id).show(); 隐藏: $('#id).css('display','none'); 等同 $('#id)[0].style.display='none'; 等同 $('#id).hide(); 2、覆盖控件原有的其他样式,进行显示和隐藏控制 用如下方法: 显示: $('#username').attr('style','display:block'); 隐藏: $('#username').attr('style','display:none'); 当然了,其他的样式也可以用以上方式进行控制。
(2)toggle() 方法:切换被选元素的 hide() 与 show()。
<div class="flex-1 overflow-y" id="valid" style="display:none;"></div> <div class="flex-1 overflow-y" id="invalid"><div> $(".rightbtn").click(function () { $("#valid").toggle(); $("#invalid").toggle(); }); toggle() 控制display:none、display:block;
<input type="radio" checked />A
<input type="radio" />B
$('input:radio[name="lineState"]').eq(1).prop("checked", true);
input radio动态切换选中状态需要使用prop
具体:https://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html
- 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
- 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
如果是aspx页面,可以使用 runat="server" visible="false"
<div onclick="aa()" id="showReservation" runat="server" visible="false">手动添加</div>
在aspx.cs放开显示:
this.showReservationRoom.Visible = true;