2011-03-28 94 views
1

的JavaScript創建下拉列表中我有下面的代碼創建和使用JavaScript刪除文本框:使用的,而不是HTML

http://jsfiddle.net/JpYGg/8/

什麼我的目標做的是逸岸創建一套三個降使用此功能下拉列表而不是創建文本框。

三個下拉列表中的代碼如下所示: http://jsfiddle.net/MWH99/

我有點堅持就如何實現這一目標。我在「dropdown」div中添加了內容,我的想法是獲得這個div的innerHTML,以便每次使用它創建三個列表?

另一個問題我是如何擁有它,這樣這些由JavaScript,而不是一個HTML一個一個JavaScript版本生成。

謝謝你的幫助。

馬丁

編輯 我有按鈕努力創造的3下拉菜單的下一行,但他們不起作用,原來確實,父下拉列表使用JavaScript來識別的方式在第一個下拉列表中選擇以更新另外兩個,而克隆的則失去此功能。

代號CNA在這裏找到:

http://pastebin.com/pt1wef76

原始的下拉菜單使用dropdown.js這是http://pastebin.com/bDLpFWJY

回答

3

爲什麼不使用JavaScript庫如jQuery例如。會使這個和其他許多事情變得更容易。能達到你想要這樣子的:

$('body').append('<!-- ANY HTML GOES HERE -->') 
+0

謝謝,我試圖只是把裏面的'下拉菜單中的代碼,但它不工作。 也試過'$(「身體」)。追加(「#下拉菜單」)'但是,從字面上打印出'#dropdown'出於某種原因,而不是股利! – martincarlin87 2011-03-28 13:21:57

+0

@ martincarlin87:應該的。如果你想這樣做,看看這個:'$('body')。append($(「#dropdown」)。html());' – 2011-03-28 13:58:51

+0

謝謝,我使用''但克隆不能像原始動態一樣工作,而是基於第一個下拉菜單中的選擇填充其他兩個。你知道爲什麼會發生? – martincarlin87 2011-03-28 14:12:53

2

有兩種基本方法;在JavaScript中創建所有元素,或反覆複製DOM(一些HTML)的一部分。

人們經常將HTML放在腳本標記中(例如,參見jQuery模板),然後獲取標記的innerHTML並使用它。例如,

<script type="text/plain" id="template"> 
    <!-- HTML that you want to duplicate in here --> 
</script> 
<div id="contentcontainer"> 
</div> 
... 
<script type="text/javascript"> 
var addAnother = function() { 
    $("#contentcontainer").append(
     $("#template").html() 
    ); 
}; 
</script> 

本示例使用jQuery的,主要是因爲jQuery是很多更簡潔,更易於閱讀,但你肯定沒有使用jQuery。這裏,addAnother函數將複製#template中的HTML並將其附加到#contentcontainer中。

在你嘗試上面,你可能是指$( '身體')追加($( '#下拉')); '#dropdown'只是一個字符串,$('#dropdown')返回id =「dropdown」的元素(或元素)。

+0

謝謝,我使用了''但克隆不能像原始動態一樣工作,而是基於第一個下拉菜單中的選擇填充其他兩個。你知道爲什麼會發生? – martincarlin87 2011-03-28 14:12:17

相關問題