工作正確的,這是我final.xml文件: -現場()點擊不javscaript
<root>
<child1 entity_id = "1" value= "Asia">
<child2 entity_id = "2" value = "india">
<child3 entity_id = "3" value = "Gujarat">
<child5 entity_id = "5" value ="Rajkot"></child5>
</child3>
<child4 entity_id = "4" value = "Rajshthan">
<child6 entity_id = "6" value = "Ajmer"></child6>
</child4>
</child2>
</child1>
</root>
這是我的html代碼: -
<body>
<div id="loader">
<span id='update-target'>Click here to load value</span>
</div>
<div id="firstLevelChild"></div>
<div id="path"><span class="tagit-new"></span></div>
</body>
這是我的腳本: -
<script>
data = false;
$(document).ready(function() {
$('#loader').click(function() {
$(this).hide();
$.ajax({
type: "GET",
url: "final.xml",
dataType: "xml",
success: function(xml) {
data = xml;
ul = $("<ul></ul>");
$(xml).find('child1').each(function(){
var value_text = $(this).attr('value');
var id = $(this).attr('entity_id');
li = $("<li id='" + id + "'></li>");
li.html(value_text);
ul.append(li);
$(this).unbind('click');
}); //close each(
ul.appendTo('#firstLevelChild');
}
}); //close $.ajax(
}); //close click(
$(document).on("click", "li", function(event) {
event.stopPropagation();
loadChild($(this).attr("id"), event);
return false;
});
});
$("#firstLevelChild ul li").live("click", function(){
$("#path .tagit-new").html($(this).html());
a = $("<a class=\"close\">x</a>\n");
$(".tagit-new").append(a);
$(".close").click(function(){
$(".tagit-new").html('');
});
});
function loadChild(id) {
var obj = $("#firstLevelChild #" + id);
if(obj.data("loaded") == null) {
ul = "<ul>";
var path = (id == 0) ? "root" : "[entity_id='" + id + "']";
// Only if it contains children
if($(data).find(path).children().length > 0) {
$("li").show();
}
$(data).find(path).children().each(function(){
var value_text = $(this).attr('value');
var id = $(this).attr('entity_id');
ul += "<li id='" + id + "'>" + value_text + "</li>";
});
ul += "</ul>";
obj.append(ul);
obj.data("loaded", true);
} else {
$("#" + id + " ul").remove();
obj.data("loaded", null);
}
}
</script>
這是js文件我使用: -
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
這裏我嘗試獲取區域形式的XML文件。
從xml文件中查找chil1屬性值。然後點擊它。點擊它顯示那裏的孩子喜歡: - 點擊Asia
顯示有孩子。 樹明智的,如: -
Asia
India
,並點擊India
Asia
India
Gujarat
Rajshthan
,並點擊古吉拉特邦
Asia
India
Gujarat
Rajkot
Rajshthan
現在我使用live()
在<span>
現在問題來追加點擊的價值是當我第一次點擊它的顯示範圍時。
但第二次點擊它們顯示有孩子。像這樣類型: -
亞洲 印度 古吉拉特邦 拉傑果德 Rajshthan 最後點擊價值拉傑果德所以在我的跨度顯示是這樣的類型: -
<div id="path"><span class="tagit-new">
拉傑果德</span></div>
現在我點擊有父那麼它的顯示屏
<div id="path"><span class="tagit-new">
古吉拉特邦拉傑科德</span></div>
作爲我的邏輯它的唯一顯示點擊文本。 Gujurat
爲什麼我得到這個porblem請回顧我的代碼,並幫我解決這個問題。
謝謝。
你爲什麼這樣做'$(本).unbind(「點擊」);'還沒有被添加到一個XML節點上DOM呢? – 2013-04-23 09:32:11
解除最後一個孩子...但不是這個問題... – 2013-04-23 09:49:41
@Jack這裏是obj.append(ul)中的一些問題;這裏我使用obj。後(UL);那麼它的工作完美,但不會在第二次點擊時將列表最小化。 – 2013-04-23 10:27:24