2016-05-28 1 views
0

html/cssを使用してドロップダウンボックスを追加します。問題は私は身体にIDが1つしかないので、私はこれを行う方法を知らない。投稿された次のコードの例を誰かが投稿することができれば、非常に感謝しています。jquery 1行の本文にドロップダウンを追加する方法はありますか?

私はこのような何かをfoudnしかし、私はどのようにidが私のコードで設定して、これが大丈夫であるかわからないのか分かりません。ここで

var someElement = $('<div/>', {id: 'someId'); $('canvas').after(someElement); $('#someId').doMoreStuff 

コードです:

<head> 
    <title>jTournament</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script src="jTournament.js"></script> 

<script> 
var matchInfo = { 
    "rounds": [{ 
     "name": "Round1", 
      "matches": [{ 
      "p1": "Bill", 
      "p2": "Bob", 
      "winner": 1 
     }, { 
      "p1": "Sam", 
      "p2": "Duddly", 
      "winner": 2 
     }, { 
      "p1": "Andy", 
      "p2": "Biff", 
      "winner": 1 
     }, { 
      "p1": "Phill", 
      "p2": "Peter", 
      "winner": 1 
     }, { 
      "p1": "John", 
      "p2": "Dave", 
      "winner": 2 
     }, { 
      "p1": "Xaus", 
      "p2": "James", 
      "winner": 2 
     }, { 
      "p1": "Kenny", 
      "p2": "Nick", 
      "winner": 1 
     }, { 
      "p1": "Fred", 
      "p2": "Pat", 
      "winner": 2 
     }] 
    }, { 
     "name": "Round2", 
     "matches": [{ 
      "p1": null, 
      "p2": null 
     }, { 
      "p1": null, 
      "p2": null 
     }, { 
      "p1": null, 
      "p2": null 
     }, { 
      "p1": null, 
      "p2": null 
     }] 
    }, { 
     "name": "Round3", 
     "matches": [{ 
      "p1": null, 
      "p2": null 
     }, { 
      "p1": null, 
      "p2": null 
     }] 
    }, { 
     "name": "Round4", 
     "matches": [{ 
      "p1": null, 
      "p2": null 
     }, ] 
    }] 
}; 
</script> 
    </head 
    <body> 
<canvas id="tournament"></canvas> 
</body> 

私は、ドロップダウンメニューを追加したいので、私はコンテンツを動的に接続することができます。あなたは

答えて

1

あなたが使用してキャンバスの後に新しい要素を追加することができ感謝:()機能あなたはあなたがAPPENDを使用して行うことができます 何かを追加したい場合は今

$('#tournament').after('<div id="newid"></div>'); 

$('#newid').append('<select></select>'); 

他に何かが必要な場合は、このリンクをチェックしてください。http://api.jquery.com/append/

+0

私はオプションをドロップダウンと置き換えたい – swipeales

+0

https://jqueryui.com/selectmenu/ メニューの場合は、このリンクを参照してください。 もしあなたが望むなら、これに対してリストを使うこともできます –

関連する問題