jstree取值的问题

openweb 2010-04-07 12:58:00

实现带选择框的tree，但不知道怎样才能获取已选择项的值。
想在页面中的text框中显示那些被选择项目的值。

...全文

339 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

openweb 2010-04-11

打赏
举报

不会吧，没人会？

openweb 2010-04-08

打赏
举报

怎么没人用JQuery的吗？

openweb 2010-04-07

打赏
举报

up升上去。

shixixi1987 2010-04-07

打赏
举报

不好意思,jquery不太熟悉

openweb 2010-04-07

打赏
举报



<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

	<title>jsTree » Demos</title>



	<script type="text/javascript" src="../lib/jquery.js"></script>

	

	<script type="text/javascript" src="../jquery.tree.js"></script>

	<script type="text/javascript" src="../plugins/jquery.tree.checkbox.js"></script>

<script type="text/javascript" src="../plugins/jquery.tree.contextmenu.js"></script>



	<link type="text/css" rel="stylesheet" href="syntax/shCore.css"/>

	<link type="text/css" rel="stylesheet" href="syntax/shThemeDefault.css"/>

	<style type="text/css">

	html, body { margin:0; padding:0; }

	body, td, th, pre, code, select, option, input, textarea { font-family:"Trebuchet MS", Sans-serif; font-size:10pt; }

	#container { width:800px; margin:10px auto; overflow:hidden; }

	.demo { height:200px; width:300px; float:left; margin:0; border:1px solid gray; font-family:Verdana; font-size:10px; background:white; }

	.code { width:490px; float:right; margin:0 0 10px 0; border:1px solid gray; }

	pre { display:block; }

	.syntaxhighlighter { margin:0 0 0 0 !important; padding:0 !important; }

	</style>

	<script type="text/javascript" src="syntax/shCore.js"></script>

	<script type="text/javascript" src="syntax/shBrushJScript.js"></script>

	<script type="text/javascript" src="syntax/shBrushXml.js"></script>

	<script type="text/javascript">

		SyntaxHighlighter.config.clipboardSwf = 'syntax/clipboard.swf';

		$(function () {

			var h = 0;

			$("#container .source").each(function () {

				var code = $(this).html().replace(/</g,'<').replace(/>/g,'>');

				var div = $('<div class="code"><pre class="brush:' + ( $(this).is("script") ? 'js' : 'xml' ) + ';">' + code + '</pre></div>');

				$(this).after(div);

			});

			SyntaxHighlighter.all();

		});

	</script>

</head>

<body>

<div id="container">

	<h1 class="title">Checkbox demo</h1>

	<p>This is a basic checkbox plugin demo.</p>

	<script type="text/javascript" class="source">

	$(function () {

		$("#demo_1").tree({

			ui : {

				theme_name : "checkbox"

			},

			plugins : { 

				checkbox : { },

				contextmenu:{},

			}

		});

	});

	</script>

	<div class="demo" id="demo_1" style="overflow:auto">

		<ul>

			<li id="phtml_1" class="open"><a href="#"><ins> </ins>Root node 1</a>

				<ul>

					<li id="phtml_2"><a href="#"><ins> </ins>Child node 1</a></li>

					<li id="phtml_3"><a href="#"><ins> </ins>Child node 2</a></li>

					<li id="phtml_3"><a href="#"><ins> </ins>Child node 3</a></li>

					<li id="phtml_4"><a href=""><ins> </ins>Child node 4</a></li>

					<li id="phtml_4"><a href="#"><ins> </ins>Some other child node with longer text</a></li>

				</ul>

			</li>

			

			<li id="phtml_5"><a href="#"><ins> </ins>Root node 2</a>

				<ul>

					<li id="phtml_2"><a href="#"><ins> </ins>Child node 1</a></li>

					<li id="phtml_3"><a href="#"><ins> </ins>Child node 2</a></li>

					<li id="phtml_3"><a href="#"><ins> </ins>Child node 3</a></li>

					<li id="phtml_4"><a href=""><ins> </ins>Child node 4</a></li>

					<li id="phtml_4"><a href="#"><ins> </ins>Some other child node with longer text</a></li>

				</ul>

			

			</li>

			

			<li id="phtml_5"><a href="#"><ins> </ins>Root node 3</a></li>

		</ul>

	</div>





	<div class="demo" id="demo_2" style="clear:both;">

		<ul>

			<li id="phtml_1a" class="open"><a href="#"><ins> </ins>Root node 1</a>

				<ul>

					<li id="phtml_2a"><a href="#"><ins> </ins>Child node 1</a></li>

					<li id="phtml_3a"><a href="#"><ins> </ins>Child node 2</a></li>

					<li id="phtml_4a"><a href="#"><ins> </ins>Some other child node with longer text</a></li>

				</ul>

			</li>

			<li id="phtml_5a"><a href="#"><ins> </ins>Root node 2</a></li>

		</ul>

	</div>

	<script type="text/javascript" class="source">

	$(function () { 

		$("#demo_2").tree({

			ui : {

				theme_name : "checkbox"

			},

			plugins : { 

				checkbox : { three_state : false }

			}

		});

	});

	</script>

</div>



<button id="showchecked">Get Seleceted Nodes</button>



</body></html>