從另一個HTML文件追加DIV

Question

嗨，大家好，我有哪些應該從外部HTML 追加的div 2個菜單按鈕現在我對外部HTML這個

 <ul> 
      <li><a href="#" onclick="javascript:test2();" value="#CS" >CS</a></li> 
      <li><a href="#" onclick="javascript:test2();" value="#PS" >PS</a></li> 
     </ul> 

和2的div，只是有簡單的文字他們說：「text1」中，而「text2」

，我使用此代碼追加數據

$.get('external/list.html', function (data) { 
     $(data).filter('#PS').appendTo('#content') 
}); 

我如何「升級」其採取例如像值的屬性並使用它來選擇要附加的div，因爲我更喜歡將它作爲1函數而不是製作2

此代碼還會顯示一個div，但它不會重置它只是一直在反覆發送同一個div我阻止它？

Answer 1

選項1

保持一個調用你的$.get，因爲你現在正在做的，但通過參考你的點擊element通過您function如下：

<ul> 
    <li><a href="#" onclick="javascript:test2(this);" value="#CS" >CS</a></li> 
    <li><a href="#" onclick="javascript:test2(this);" value="#PS" >PS</a></li> 
</ul> 

JS

function test2(ctrl) 
{ 
    var element=$(ctrl).attr('value'); 
    $.get('external/list.html', function (data) { 

$（data）.filter（element）.appendTo（'＃content'）;

  //element will have value either #PS or #CS 
    }); 
} 

注 - .appendTo將保持對數據附加到你的DOM，而是使用.html它取代的內容，每次

例：

$(data).filter(element).html('#content'); 

---

選項2

您還可以附加click事件您a標籤與兩因而，如下消除直列function調用中給出一個通用類：

<ul> 
    <li><a href="#" value="#CS" class="menu">CS</a></li> 
    <li><a href="#" value="#PS" class="menu">PS</a></li> 
</ul> 

JS

$(".menu").on('click',function(){ var element=$(this).attr('value'); //this refers to clicked element $.get('external/list.html', function (data) { 

$（da TA）.filter（元素）。appendTo（ '＃內容'）;

  //element will have value either #PS or #CS 
    }); 
}); 

---

更新

理想html應該工作，但我強加給在錯誤的方式。你只需要改變一件事如下：

$("#content").html($(data).filter(element));