TreeView無刷新獲取text及value實(shí)現(xiàn)代碼
更新時(shí)間：2013年10月14日 15:31:39 作者：
這篇文章介紹了TreeView無刷新獲取text及value實(shí)現(xiàn)代碼，有需要的朋友可以參考一下
前臺(tái)代碼：
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
#middle{ top:0; left:0;background-color:#fff; position:absolute; z-index:2; filter:alpha(opacity=60); display:none;}
#showTree{ width:300px; height:200px; position:fixed; z-index:2; display:none; border:1px solid red;}
</style>
<script type="text/javascript">
function ShowDIv() {
var txt = document.getElementById("txt");
txt.blur();
var divmid = document.getElementById("middle");
divmid.style.display = "block";
divmid.style.width = "100%";
divmid.style.height = "100%";
var divshow = document.getElementById("showTree");
divshow.style.display = "block";
divshow.style.left = txt.offsetLeft;
divshow.style.top = txt.offsetTop;
return false;
}
function CloseDiv() {
var divmid = document.getElementById("middle");
divmid.style.display = "none";
var divshow = document.getElementById("showTree");
divshow.style.display = "none";
return false;
}
function TreeViewClick() {
if (event.srcElement.innerText == "" || event.srcElement.length <= 0 || event.srcElement.nameProp == undefined) {
return true;
}
var id = event.srcElement.id;
var a = document.getElementById(id);
var href = a.href;
var index = href.indexOf("#");
var retstr = href.substr(index + 1);
//
var ret = a.innerText;
if (ret != "") {
document.getElementById("txt").value = ret;
document.getElementById("TextBox2").value = retstr;
document.getElementById("HiddenField1").value = retstr;
}
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:Button ID="Button1" runat="server" Text="顯示value" onclick="Button1_Click" />
<br />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
Text:<asp:TextBox ID="txt" runat="server" onfocus="return ShowDIv()"></asp:TextBox>
<br />
Value:
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</div>
<div id="middle"></div>
<div id="showTree">
<br />
<br />
<input type="button" value="close" onclick="return CloseDiv()" />
<asp:TreeView ID="TreeView1" runat="server">
<Nodes>
<asp:TreeNode Text="A" Value="0" NavigateUrl="#0">
<asp:TreeNode Text="A1" Value="00" NavigateUrl="#00">
<asp:TreeNode Text="A11" Value="000" NavigateUrl="#000"></asp:TreeNode>
<asp:TreeNode Text="A12" Value="001" NavigateUrl="#001"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="A2" Value="01" NavigateUrl="#01"></asp:TreeNode>
<asp:TreeNode Text="A3" Value="02" NavigateUrl="#02"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="B" Value="1" NavigateUrl="#1">
<asp:TreeNode Text="B1" Value="10" NavigateUrl="#10"></asp:TreeNode>
<asp:TreeNode Text="B2" Value="11" NavigateUrl="#11"></asp:TreeNode>
<asp:TreeNode Text="B3" Value="12" NavigateUrl="#12"></asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
</div>
</form>
</body>
</html>
后臺(tái)代碼：
public partial class newpage_Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
this.TreeView1.Attributes.Add("onclick", "return TreeViewClick()");//增加特性，實(shí)現(xiàn)無自動(dòng)回傳
}
protected void Button1_Click(object sender, EventArgs e)
{
this.TextBox1.Text = this.HiddenField1.Value;
}
}
復(fù)制代碼 代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
#middle{ top:0; left:0;background-color:#fff; position:absolute; z-index:2; filter:alpha(opacity=60); display:none;}
#showTree{ width:300px; height:200px; position:fixed; z-index:2; display:none; border:1px solid red;}
</style>
<script type="text/javascript">
function ShowDIv() {
var txt = document.getElementById("txt");
txt.blur();
var divmid = document.getElementById("middle");
divmid.style.display = "block";
divmid.style.width = "100%";
divmid.style.height = "100%";
var divshow = document.getElementById("showTree");
divshow.style.display = "block";
divshow.style.left = txt.offsetLeft;
divshow.style.top = txt.offsetTop;
return false;
}
function CloseDiv() {
var divmid = document.getElementById("middle");
divmid.style.display = "none";
var divshow = document.getElementById("showTree");
divshow.style.display = "none";
return false;
}
function TreeViewClick() {
if (event.srcElement.innerText == "" || event.srcElement.length <= 0 || event.srcElement.nameProp == undefined) {
return true;
}
var id = event.srcElement.id;
var a = document.getElementById(id);
var href = a.href;
var index = href.indexOf("#");
var retstr = href.substr(index + 1);
//
var ret = a.innerText;
if (ret != "") {
document.getElementById("txt").value = ret;
document.getElementById("TextBox2").value = retstr;
document.getElementById("HiddenField1").value = retstr;
}
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:Button ID="Button1" runat="server" Text="顯示value" onclick="Button1_Click" />
<br />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
Text:<asp:TextBox ID="txt" runat="server" onfocus="return ShowDIv()"></asp:TextBox>
<br />
Value:
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</div>
<div id="middle"></div>
<div id="showTree">
<br />
<br />
<input type="button" value="close" onclick="return CloseDiv()" />
<asp:TreeView ID="TreeView1" runat="server">
<Nodes>
<asp:TreeNode Text="A" Value="0" NavigateUrl="#0">
<asp:TreeNode Text="A1" Value="00" NavigateUrl="#00">
<asp:TreeNode Text="A11" Value="000" NavigateUrl="#000"></asp:TreeNode>
<asp:TreeNode Text="A12" Value="001" NavigateUrl="#001"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="A2" Value="01" NavigateUrl="#01"></asp:TreeNode>
<asp:TreeNode Text="A3" Value="02" NavigateUrl="#02"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="B" Value="1" NavigateUrl="#1">
<asp:TreeNode Text="B1" Value="10" NavigateUrl="#10"></asp:TreeNode>
<asp:TreeNode Text="B2" Value="11" NavigateUrl="#11"></asp:TreeNode>
<asp:TreeNode Text="B3" Value="12" NavigateUrl="#12"></asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
</div>
</form>
</body>
</html>
后臺(tái)代碼：
復(fù)制代碼 代碼如下:
public partial class newpage_Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
this.TreeView1.Attributes.Add("onclick", "return TreeViewClick()");//增加特性，實(shí)現(xiàn)無自動(dòng)回傳
}
protected void Button1_Click(object sender, EventArgs e)
{
this.TextBox1.Text = this.HiddenField1.Value;
}
}
相關(guān)文章
asp.net簡(jiǎn)單實(shí)現(xiàn)頁面換膚的方法
這篇文章主要介紹了asp.net簡(jiǎn)單實(shí)現(xiàn)頁面換膚的方法,可實(shí)現(xiàn)給頁面動(dòng)態(tài)添加樣式的功能,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-12-12
屬性的定義和使用 屬性由兩個(gè)部分組成：屬性頭和存儲(chǔ)器。存儲(chǔ)器分為get訪問器和set訪問器。聲明屬性的一般形式為： 修飾符 類型 屬性名2008-05-05
用類的繼承關(guān)系(重寫父類的方法)實(shí)現(xiàn)簡(jiǎn)易后臺(tái)代碼模板
Asp.net的優(yōu)勢(shì)就在于快速構(gòu)建應(yīng)用，而對(duì)于一些最基礎(chǔ)數(shù)據(jù)的增刪改以及分頁事件或者樣式的設(shè)定可以通過在父類中寫上虛方法來供子類調(diào)用,接下來將為您測(cè)試一下用子類重寫父類的方法實(shí)現(xiàn)在模板的基礎(chǔ)上衍生變化2013-01-01
微信小程序基于騰訊云對(duì)象存儲(chǔ)的圖片上傳功能
這篇文章主要介紹了微信小程序基于騰訊云對(duì)象存儲(chǔ)的圖片上傳功能,需要的朋友可以參考下2018-03-03
ASP.NET中利用DataList實(shí)現(xiàn)圖片無縫滾動(dòng) 實(shí)例分享
這個(gè)問題之前也困擾我，后來解決了，拿出來分享下，以后用也方便，代碼很容易看懂，不多說什么了2013-06-06
頁面轉(zhuǎn)向也是有技巧的，下面的是asp.net下的幾種轉(zhuǎn)向方法。2009-02-02
使用jQuery Uploader顯示文件上傳進(jìn)度
在上傳大文件的時(shí)候, 我們都希望可以向用戶顯示上傳的進(jìn)度, 那么這里介紹的就是使用 jQuery Uploader 來實(shí)現(xiàn)這樣的效果2011-12-12
從外部的js文件中獲取ASPX頁面的控件ClientID(get control reference from external javascript)2009-02-02
Repeater事件OnItemCommand取得行內(nèi)控件的方法
這篇文章主要介紹了Repeater事件OnItemCommand取得行內(nèi)控件的方法，有需要的朋友可以參考一下2014-01-01
asp.net(C#) 開源資源大匯總，想要學(xué)習(xí)c#的朋友可以參考下2012-05-05