JavaScript 取得 .NET 控制項的方法整理
JavaScript要取得頁面控制項的方法還蠻多的
大概整理出幾種
1.最原始的方法getElementById：
document.getElementById("Label1").innerText;
這種方法很簡單直覺，不過如果Lable是在某個元件裡面名稱就會變得很長
EX:ctl00_ctl00_MainContentPlaceHolder_MainContentPlaceHolder_Lable1
2.使用<%=Label1.ClientID %>取代ID
document.getElementById('<%=Label1.ClientID %>').innerText;
改善了第一種方法的缺點，不過在一些情況下會無法使用
3.使用jQuery取得Id
$("#Label1").text();
4.jQuery取得所有Id為Label1結尾的物件
$("[id*=Label1]").text();
這種方法會找到全部叫做的Label1物件
EX: NameLabel1,PhoneLabel1……
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function () {
$("#btnShowText1").click(function () {
var value = document.getElementById("Label1").innerText;
alert(value);
value = document.getElementById('<%=Label1.ClientID %>').innerText;
alert(value);
});
$("#btnShowText2").click(function () {
var value = $("#Label1").text();
alert(value);
});
$("#btnShowText3").click(function () {
var value = $('#<%=Label1.ClientID %>').text();
alert(value);
});
$("#btnShowText4").click(function () {
var value = $("[id*=Label1]").text();
alert(value);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="Label1" runat="server" Text="測試1"></asp:Label><br />
<input id="btnShowText1" type="button" value="使用js getElementById" />
<input id="btnShowText2" type="button" value="使用jQuery ById" />
<input id="btnShowText3" type="button" value="找到Label1.ClientID" />
<input id="btnShowText4" type="button" value="使用jQuery 找出所有Id最後=Label1" />
</div>
</form>
</body>
</html>Technorati 的標籤: JavaScript,DOM