1:使用jquery显示和隐藏相应的html标签时
一般做法先判断,先隐藏不显示的,然后在根据相应的条件再隐去判断,隐藏显示的,显示隐藏的,这种做法繁琐麻烦,判断还很多。
简单做法:所有的html都让他显示,在判断的时候隐藏或者显示相应的html标签,这样你会少些很多代码。
事例如下:实现功能当选择
/// <summary>
/// 价格取值
/// </summary>
public enum TaskSalaryType
{
/// <summary>
///
/// </summary>
[Description("定额")]
Single,
/// <summary>
///
/// </summary>
[Description("区间值")]
Double,
/// <summary>
///
/// </summary>
[Description("面议")]
Negotiation
}
<asp:DropDownList ID="ddlSalaryType" CssClass="select_style round_corner" runat="server">
</asp:DropDownList>
<span id="spanMoney1">¥<asp:TextBox ID="tbMoney1" runat="server" CssClass="textbox_style short_length" ToolTip="外包金额"></asp:TextBox>
<HuJToolKit:HuJVerify ID="HuJVerify3" runat="server" MinLength="0" MaxLength="30" ShowErrorMessageLabel="True" TargetID="tbMoney1" ButtonTriggerID="btSave" VerifyType="PositiveNumber" EnableAutoTrim="true" EnableTransformDB2SB="true" OnVerifySuccess="HuJVerify6_VerifySuccess" />
</span><span id="spanMoney2"> 至 ¥<asp:TextBox ID="tbMoney2" runat="server" CssClass="textbox_style short_length" ToolTip="外包金额"></asp:TextBox>
<HuJToolKit:HuJVerify ID="HuJVerify6" runat="server" MinLength="0" MaxLength="255" ShowErrorMessageLabel="True" TargetID="tbMoney2" ButtonTriggerID="btSave" VerifyType="PositiveNumber" EnableAutoTrim="true" EnableTransformDB2SB="true" OnVerifySuccess="HuJVerify6_VerifySuccess" />
</span>
当选择定额是隐藏spanMoney2,当选择面议时隐藏spanMoney1和spanMoney2,当选择double时两个都显示。
简单的jquery解决方法如下:
var t = $('#ddlSalaryType').find('option:selected').attr('value');
if (t == 'Negotiation') {
$('#spanMoney1').hide();
$('#spanMoney2').hide();
} else if (t == 'Single') {
$('#spanMoney2').hide();
}
2:jquery中" "和">"获取子元素的区别:
jquery代码如下:
<script type="text/javascript">
$(function () {
var l = $('#divTest input');
alert('input标签找到'+l.length);//这个会弹出提示框找到input标签2
var l = $('#divTest>input');
alert(l.length);//这个弹出提示框0
});
</script>
<div id="divTest">
<div style="text-align: center; line-height:2em;">
<input type="text" name="uName" /><br />
<input type="text" name="uTile" />
</div>
</div>
所以在jquery中用" "查找子元素是查找的父节点下面的所有的element,包含子节点的子节点
">"查找的是当前元素的子节点(当且仅当当前元素的子节点不包含该元素子节点的子节点)